feat: Vite compat DDEV

inc/vite.php

@@ -2,6 +2,7 @@
 if (!defined("_ECRIRE_INC_VERSION")) {
 	return;
 }
+defined('_SERVEUR_MODE') || define('_SERVEUR_MODE', 'PROD');
 
 // Helpers here serve as example. Change to suit your needs.
 // const VITE_HOST = "https://localhost:5134";
@@ -16,7 +17,12 @@ if (!defined("_ECRIRE_INC_VERSION")) {
 // Prints all the html entries needed for Vite
 
 function vite(string $entry, $port = "5134"): string {
+	if ($_SERVER['IS_DDEV_PROJECT'] ) {
+		defined('VITE_HOST') ||	define('VITE_HOST', "https://" . $_SERVER['SERVER_ADDR'] . ":" .$port);
+	} else {
 		defined('VITE_HOST') ||	define('VITE_HOST', "https://localhost:".$port);
+	}
+
 	return "\n" .
 		jsTag($entry) .
 		"\n" .
@@ -38,12 +44,8 @@ function isDev(string $entry): bool {
 		return $exists;
 	}
 
-	if (
+	if ( _SERVEUR_MODE !== 'PROD') {
-		!empty($_SERVER["SERVER_ADDR"]) and
-		in_array($_SERVER["SERVER_ADDR"], ["::1", "127.0.0.1"])
-	) {
 		$handle = curl_init(VITE_HOST . "/" . $entry);
-
 		curl_setopt($handle, CURLOPT_SSL_VERIFYHOST, false);
 		curl_setopt($handle, CURLOPT_SSL_VERIFYPEER, false);
 

package.json

@@ -2,23 +2,33 @@
   "name": "gamutable",
   "version": "1.0.0",
   "private": true,
+  "type": "module",
   "scripts": {
-		"dev": "APP_ENV=development vite",
+    "dev": "vite --mode dev",
-		"build": "vite build",
+    "build": "vite build --mode prod",
-		"watch": "vite build --watch",
+    "watch": "vite build --watch --mode prod"
-		"preview": "vite preview"
   },
   "dependencies": {
-		"@vitejs/plugin-basic-ssl": "^1.0.1",
+    "@vueform/multiselect": "^2.6.6",
-		"typescript": "^5.1.6",
+    "jenesius-vue-modal": "^1.11.0",
-		"vue": "^3.2.47",
+    "json5": "^2.2.3",
+    "luxon": "^3.4.4",
+    "typescript": "^5.3.3",
+    "vue": "^3.4.21",
+    "vue-cookie-next": "^1.3.0",
     "vue-next-select": "^2.10.5",
-		"vue-papa-parse": "^3.1.0"
+    "vue-papa-parse": "^3.1.0",
+    "vue3-selecto": "^1.12.3"
   },
   "devDependencies": {
-		"@vitejs/plugin-vue": "^4.0.0",
+    "@types/jquery": "^3.5.29",
-		"@vue/compiler-sfc": "^3.2.47",
+    "@types/luxon": "^3.4.2",
-		"vite": "^4.1.1",
+    "@vitejs/plugin-vue": "^5.0.4",
-		"vite-plugin-live-reload": "^3.0.1"
+    "@vue/compiler-sfc": "^3.4.21",
+    "eslint": "^8.57.0",
+    "eslint-plugin-vue": "^9.22.0",
+    "vite": "^5.1.4",
+    "vite-plugin-live-reload": "^3.0.3",
+    "vite-plugin-mkcert": "^1.17.4"
   }
 }

vite.config.js

@@ -1,12 +1,21 @@
-import { defineConfig, splitVendorChunkPlugin } from "vite";
+// import { defineConfig, splitVendorChunkPlugin } from "vite";
+import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
 import liveReload from "vite-plugin-live-reload";
-import path from "path";
+import path, { dirname } from "path";
-import fs from "fs";
+// import fs from "fs";
-import basicSsl from "@vitejs/plugin-basic-ssl";
+import mkcert from 'vite-plugin-mkcert'
+import { fileURLToPath } from 'url'
 
 // https://vitejs.dev/config/
-export default defineConfig({
+export default defineConfig(({ mode }) => {
+	const __filename = fileURLToPath(import.meta.url)
+	const __dirname = dirname(__filename)
+	const port = 5134
+	return {
+		root: "src",
+		base: mode === "dev" ? "/" : "/dist/",
+
 		plugins: [
 			vue({
 				template: {
@@ -17,18 +26,17 @@ export default defineConfig({
 				},
 			}),
 			liveReload([__dirname + "/**/*.php", __dirname + "/**/*.html"]),
-		splitVendorChunkPlugin(),
+			// splitVendorChunkPlugin(),
-		// basicSsl(),
+			mkcert()
 		],
 
 		// config
-	root: "src",
-	base: process.env.APP_ENV === "development" ? "/" : "/dist/",
 
 		build: {
 			outDir: "../dist",
 			emptyOutDir: true,
 			manifest: true,
+			// cssCodeSplit: false,
 
 			rollupOptions: {
 				input: path.resolve(__dirname, "src/gamutable.js"),
@@ -36,13 +44,9 @@ export default defineConfig({
 		},
 
 		server: {
+			host: true,
+			port: port,
 			strictPort: true,
-		port: 5134,
-		https: {
-			key: fs.readFileSync("certs/vite.key.pem"),
-			cert: fs.readFileSync("certs/vite.crt.pem"),
-		},
-		cors: true,
 		},
 
 		// required for in-browser template compilation
@@ -52,4 +56,5 @@ export default defineConfig({
 				vue: "vue/dist/vue.esm-bundler.js",
 			},
 		},
+	}
 });