@gxp-dev/tools 2.0.63 → 2.0.64

package/bin/lib/commands/dev.js

@@ -5,16 +5,16 @@
  * and browser extension launching.
  */
 
-const path = require("path");
-const fs = require("fs");
-const shell = require("shelljs");
-const dotenv = require("dotenv");
+const path = require("path")
+const fs = require("fs")
+const shell = require("shelljs")
+const dotenv = require("dotenv")
 const {
 	findProjectRoot,
 	resolveGxPaths,
 	resolveFilePath,
 	findExistingCertificates,
-} = require("../utils");
+} = require("../utils")
 
 /**
  * Get browser extension paths and commands
@@ -26,23 +26,23 @@ const {
  * @param {number|string} options.port - Dev server port
  */
 function getBrowserExtensionConfig(browser, projectPath, paths, options = {}) {
-	const { useHttps = true, port = 3060 } = options;
-	const protocol = useHttps ? "https" : "http";
-	const startUrl = `${protocol}://localhost:${port}`;
+	const { useHttps = true, port = 3060 } = options
+	const protocol = useHttps ? "https" : "http"
+	const startUrl = `${protocol}://localhost:${port}`
 
 	if (browser === "firefox") {
-		let extensionPath = path.join(projectPath, "browser-extensions", "firefox");
+		let extensionPath = path.join(projectPath, "browser-extensions", "firefox")
 
 		if (!fs.existsSync(extensionPath)) {
 			const toolkitExtensionPath = path.join(
 				paths.packageRoot,
 				"browser-extensions",
-				"firefox"
-			);
+				"firefox",
+			)
 			if (fs.existsSync(toolkitExtensionPath)) {
-				extensionPath = toolkitExtensionPath;
+				extensionPath = toolkitExtensionPath
 			} else {
-				return null;
+				return null
 			}
 		}
 
@@ -52,37 +52,33 @@ function getBrowserExtensionConfig(browser, projectPath, paths, options = {}) {
 			command: `npx web-ext run --source-dir "${extensionPath}" --start-url "${startUrl}"`,
 			extensionPath,
 			startUrl,
-		};
+		}
 	}
 
 	if (browser === "chrome") {
-		let extensionPath = path.join(projectPath, "browser-extensions", "chrome");
-		let scriptPath = path.join(projectPath, "scripts", "launch-chrome.js");
+		let extensionPath = path.join(projectPath, "browser-extensions", "chrome")
+		let scriptPath = path.join(projectPath, "scripts", "launch-chrome.js")
 
 		if (!fs.existsSync(extensionPath)) {
 			const toolkitExtensionPath = path.join(
 				paths.packageRoot,
 				"browser-extensions",
-				"chrome"
-			);
+				"chrome",
+			)
 			if (fs.existsSync(toolkitExtensionPath)) {
-				extensionPath = toolkitExtensionPath;
-				scriptPath = path.join(
-					paths.packageRoot,
-					"scripts",
-					"launch-chrome.js"
-				);
+				extensionPath = toolkitExtensionPath
+				scriptPath = path.join(paths.packageRoot, "scripts", "launch-chrome.js")
 			} else {
-				return null;
+				return null
 			}
 		}
 
 		if (!fs.existsSync(scriptPath)) {
-			return null;
+			return null
 		}
 
 		// Normalize path separators for cross-platform shell compatibility
-		const normalizedScriptPath = scriptPath.replace(/\\/g, "/");
+		const normalizedScriptPath = scriptPath.replace(/\\/g, "/")
 		return {
 			name: "CHROME",
 			color: "blue",
@@ -90,159 +86,159 @@ function getBrowserExtensionConfig(browser, projectPath, paths, options = {}) {
 			command: `node "${normalizedScriptPath}"`,
 			extensionPath,
 			startUrl,
-		};
+		}
 	}
 
-	return null;
+	return null
 }
 
 /**
  * Development command - starts the dev server
  */
 function devCommand(argv) {
-	const paths = resolveGxPaths();
-	const projectPath = findProjectRoot();
+	const paths = resolveGxPaths()
+	const projectPath = findProjectRoot()
 
 	// Load .env file if it exists for default values
-	const envPath = path.join(projectPath, ".env");
-	const envExamplePath = path.join(projectPath, ".env.example");
+	const envPath = path.join(projectPath, ".env")
+	const envExamplePath = path.join(projectPath, ".env.example")
 
 	// Load .env file into process.env
 	if (fs.existsSync(envPath)) {
-		console.log("📋 Loading environment variables from .env file");
-		dotenv.config({ path: envPath });
+		console.log("📋 Loading environment variables from .env file")
+		dotenv.config({ path: envPath })
 	} else if (fs.existsSync(envExamplePath)) {
 		console.log(
-			"💡 Tip: Create .env file from .env.example to customize your environment settings"
-		);
-		console.log("   cp .env.example .env");
+			"💡 Tip: Create .env file from .env.example to customize your environment settings",
+		)
+		console.log("   cp .env.example .env")
 	}
 
 	// Check for SSL certificates unless explicitly disabled
-	let useHttps = !argv["no-https"];
-	let certPath = "";
-	let keyPath = "";
+	let useHttps = !argv["no-https"]
+	let certPath = ""
+	let keyPath = ""
 
 	if (useHttps) {
-		const certsDir = path.join(projectPath, ".certs");
-		const existingCerts = findExistingCertificates(certsDir);
+		const certsDir = path.join(projectPath, ".certs")
+		const existingCerts = findExistingCertificates(certsDir)
 
 		if (!existingCerts) {
 			console.log(
-				"⚠ SSL certificates not found. Run 'npm run setup-ssl' to enable HTTPS"
-			);
-			console.log("🌐 Starting HTTP development server...");
-			useHttps = false;
+				"⚠ SSL certificates not found. Run 'npm run setup-ssl' to enable HTTPS",
+			)
+			console.log("🌐 Starting HTTP development server...")
+			useHttps = false
 		} else {
-			console.log("🔒 Starting HTTPS development server...");
+			console.log("🔒 Starting HTTPS development server...")
 			console.log(
-				`📁 Using certificate: ${path.basename(existingCerts.certPath)}`
-			);
-			console.log(`🔑 Using key: ${path.basename(existingCerts.keyPath)}`);
-			certPath = existingCerts.certPath;
-			keyPath = existingCerts.keyPath;
+				`📁 Using certificate: ${path.basename(existingCerts.certPath)}`,
+			)
+			console.log(`🔑 Using key: ${path.basename(existingCerts.keyPath)}`)
+			certPath = existingCerts.certPath
+			keyPath = existingCerts.keyPath
 		}
 	} else {
-		console.log("🌐 Starting HTTP development server...");
+		console.log("🌐 Starting HTTP development server...")
 	}
 
 	// Determine final port value (priority: CLI arg > .env > default)
-	const finalPort = argv.port || process.env.NODE_PORT || 3000;
-	console.log(`🌐 Development server will start on port: ${finalPort}`);
+	const finalPort = argv.port || process.env.NODE_PORT || 3000
+	console.log(`🌐 Development server will start on port: ${finalPort}`)
 
 	// Check if mock API should be enabled
-	const withMock = argv["with-mock"];
+	const withMock = argv["with-mock"]
 	if (withMock) {
-		console.log("🎭 Mock API will be enabled");
+		console.log("🎭 Mock API will be enabled")
 	}
 
 	// Socket server starts by default unless --no-socket is passed
-	const noSocket = argv["no-socket"];
-	let serverJsPath = "";
+	const noSocket = argv["no-socket"]
+	let serverJsPath = ""
 	if (!noSocket) {
 		// Check for local server.js first, then runtime directory
-		const serverJs = resolveFilePath("server.js", "", "runtime");
+		const serverJs = resolveFilePath("server.js", "", "runtime")
 		if (!fs.existsSync(serverJs.path)) {
-			console.warn("⚠ server.js not found. Skipping Socket.IO server.");
+			console.warn("⚠ server.js not found. Skipping Socket.IO server.")
 		} else {
-			serverJsPath = serverJs.path;
+			serverJsPath = serverJs.path
 			console.log(
 				`📡 Starting Socket.IO server with nodemon... (${
 					serverJs.isLocal ? "local" : "package"
-				} version)`
-			);
-			console.log(`📁 Using: ${serverJsPath}`);
+				} version)`,
+			)
+			console.log(`📁 Using: ${serverJsPath}`)
 		}
 	}
 
-	// Check for local dev files, otherwise use runtime versions
-	// These files can be published for customization: gxdev publish vite.config.js
-	let viteConfigPath = paths.viteConfigPath;
-	const localViteConfigPath = path.join(projectPath, "vite.config.js");
-	const localIndexHtml = path.join(projectPath, "index.html");
-	const localMainJs = path.join(projectPath, "main.js");
+	// Vite config always comes from the runtime. Projects extend it via an
+	// optional `vite.extend.js` at the project root (see runtime/vite.config.js).
+	const viteConfigPath = paths.viteConfigPath
+	const localIndexHtml = path.join(projectPath, "index.html")
+	const localMainJs = path.join(projectPath, "main.js")
 
-	const hasLocalViteConfig = fs.existsSync(localViteConfigPath);
-	const hasLocalIndexHtml = fs.existsSync(localIndexHtml);
-	const hasLocalMainJs = fs.existsSync(localMainJs);
+	const hasLocalIndexHtml = fs.existsSync(localIndexHtml)
+	const hasLocalMainJs = fs.existsSync(localMainJs)
+	const hasLocalExtend =
+		fs.existsSync(path.join(projectPath, "vite.extend.js")) ||
+		fs.existsSync(path.join(projectPath, "vite.extend.mjs"))
 
-	if (hasLocalViteConfig) {
-		viteConfigPath = localViteConfigPath;
-		console.log("📁 Using local vite.config.js");
-	}
 	if (hasLocalIndexHtml) {
-		console.log("📁 Using local index.html");
+		console.log("📁 Using local index.html")
 	}
 	if (hasLocalMainJs) {
-		console.log("📁 Using local main.js");
+		console.log("📁 Using local main.js")
 	}
-
-	// Log if using all runtime files (default)
-	if (!hasLocalViteConfig && !hasLocalIndexHtml && !hasLocalMainJs) {
-		console.log("📦 Using runtime dev files (publish to customize)");
+	if (hasLocalExtend) {
+		console.log("🧩 Extending vite config from vite.extend.js")
+	}
+	if (!hasLocalIndexHtml && !hasLocalMainJs && !hasLocalExtend) {
+		console.log(
+			"📦 Using runtime dev files (create vite.extend.js to customize)",
+		)
 	}
 
 	// Set environment variables directly on process.env for cross-platform compatibility.
 	// Using shell-level "export"/"set" syntax breaks on Windows due to cmd.exe quote parsing.
 	if (!process.env.NODE_LOG_LEVEL) {
-		process.env.NODE_LOG_LEVEL = argv["node-log-level"] || "info";
+		process.env.NODE_LOG_LEVEL = argv["node-log-level"] || "info"
 	}
 	if (!process.env.NODE_PORT) {
-		process.env.NODE_PORT = String(finalPort);
+		process.env.NODE_PORT = String(finalPort)
 	}
 	if (!process.env.COMPONENT_PATH) {
-		process.env.COMPONENT_PATH = argv["component-path"] || "./src/Plugin.vue";
+		process.env.COMPONENT_PATH = argv["component-path"] || "./src/Plugin.vue"
 	}
 
 	// Always set HTTPS-related variables (these are dynamic)
-	process.env.USE_HTTPS = useHttps ? "true" : "false";
-	process.env.CERT_PATH = certPath;
-	process.env.KEY_PATH = keyPath;
+	process.env.USE_HTTPS = useHttps ? "true" : "false"
+	process.env.CERT_PATH = certPath
+	process.env.KEY_PATH = keyPath
 
 	// Set mock API flag if requested
 	if (withMock) {
-		process.env.MOCK_API_ENABLED = "true";
+		process.env.MOCK_API_ENABLED = "true"
 	}
 
 	// Check for browser extension flags
-	const launchFirefox = argv.firefox;
-	const launchChrome = argv.chrome;
+	const launchFirefox = argv.firefox
+	const launchChrome = argv.chrome
 
 	// Get browser extension configurations
-	let firefoxConfig = null;
-	let chromeConfig = null;
+	let firefoxConfig = null
+	let chromeConfig = null
 
 	if (launchFirefox) {
 		firefoxConfig = getBrowserExtensionConfig("firefox", projectPath, paths, {
 			useHttps,
 			port: finalPort,
-		});
+		})
 		if (firefoxConfig) {
-			console.log("🦊 Firefox extension will launch with dev server");
-			console.log(`📁 Extension path: ${firefoxConfig.extensionPath}`);
-			console.log(`🌐 Start URL: ${firefoxConfig.startUrl}`);
+			console.log("🦊 Firefox extension will launch with dev server")
+			console.log(`📁 Extension path: ${firefoxConfig.extensionPath}`)
+			console.log(`🌐 Start URL: ${firefoxConfig.startUrl}`)
 		} else {
-			console.warn("⚠️ Firefox extension not found, skipping");
+			console.warn("⚠️ Firefox extension not found, skipping")
 		}
 	}
 
@@ -250,74 +246,74 @@ function devCommand(argv) {
 		chromeConfig = getBrowserExtensionConfig("chrome", projectPath, paths, {
 			useHttps,
 			port: finalPort,
-		});
+		})
 		if (chromeConfig) {
-			console.log("🚀 Chrome extension will launch with dev server");
-			console.log(`📁 Extension path: ${chromeConfig.extensionPath}`);
-			console.log(`🌐 Start URL: ${chromeConfig.startUrl}`);
+			console.log("🚀 Chrome extension will launch with dev server")
+			console.log(`📁 Extension path: ${chromeConfig.extensionPath}`)
+			console.log(`🌐 Start URL: ${chromeConfig.startUrl}`)
 		} else {
-			console.warn("⚠️ Chrome extension not found, skipping");
+			console.warn("⚠️ Chrome extension not found, skipping")
 		}
 	}
 
 	// Set CHROME_EXTENSION_PATH on process.env so launch-chrome.js inherits it
 	if (chromeConfig) {
-		process.env.CHROME_EXTENSION_PATH = chromeConfig.extensionPath;
+		process.env.CHROME_EXTENSION_PATH = chromeConfig.extensionPath
 	}
 
 	// Build the command based on what's requested
-	let command;
+	let command
 
 	// Collect all processes to run
-	const processes = [];
-	const names = [];
-	const colors = [];
+	const processes = []
+	const names = []
+	const colors = []
 
 	// Normalize path separators to forward slashes for cross-platform shell compatibility
-	const normalizedViteConfigPath = viteConfigPath.replace(/\\/g, "/");
+	const normalizedViteConfigPath = viteConfigPath.replace(/\\/g, "/")
 
 	// Vite is always included
-	const viteCommand = `npx vite dev --config "${normalizedViteConfigPath}"`;
-	processes.push(`"${viteCommand}"`);
-	names.push("VITE");
-	colors.push("cyan");
+	const viteCommand = `npx vite dev --config "${normalizedViteConfigPath}"`
+	processes.push(`"${viteCommand}"`)
+	names.push("VITE")
+	colors.push("cyan")
 
 	// Socket server (on by default, skip if --no-socket or server.js not found)
 	if (serverJsPath) {
-		const normalizedServerPath = serverJsPath.replace(/\\/g, "/");
-		processes.push(`"npx nodemon \\"${normalizedServerPath}\\""`);
-		names.push("SOCKET");
-		colors.push("green");
+		const normalizedServerPath = serverJsPath.replace(/\\/g, "/")
+		processes.push(`"npx nodemon \\"${normalizedServerPath}\\""`)
+		names.push("SOCKET")
+		colors.push("green")
 	}
 
 	// Firefox extension (optional)
 	if (firefoxConfig) {
-		processes.push(`"${firefoxConfig.command}"`);
-		names.push(firefoxConfig.name);
-		colors.push(firefoxConfig.color);
+		processes.push(`"${firefoxConfig.command}"`)
+		names.push(firefoxConfig.name)
+		colors.push(firefoxConfig.color)
 	}
 
 	// Chrome extension (optional)
 	if (chromeConfig) {
-		processes.push(`"${chromeConfig.command}"`);
-		names.push(chromeConfig.name);
-		colors.push(chromeConfig.color);
+		processes.push(`"${chromeConfig.command}"`)
+		names.push(chromeConfig.name)
+		colors.push(chromeConfig.color)
 	}
 
 	// Build the final command
 	if (processes.length > 1) {
 		// Use concurrently to run multiple processes
 		command = `npx concurrently --names "${names.join(
-			","
-		)}" --prefix-colors "${colors.join(",")}" ${processes.join(" ")}`;
+			",",
+		)}" --prefix-colors "${colors.join(",")}" ${processes.join(" ")}`
 	} else {
 		// Just run Vite dev server alone
-		command = `npx vite dev --config "${normalizedViteConfigPath}"`;
+		command = `npx vite dev --config "${normalizedViteConfigPath}"`
 	}
 
-	shell.exec(command);
+	shell.exec(command)
 }
 
 module.exports = {
 	devCommand,
-};
+}