@mcpc-tech/unplugin-dev-inspector-mcp 0.0.18 → 0.0.20

package/dist/cli.js

@@ -1,6 +1,11 @@
 #!/usr/bin/env node
 import { i as setupMcpMiddleware, n as setupAcpMiddleware, r as setupInspectorMiddleware, t as updateMcpConfigs } from "./config-updater.js";
 import http from "node:http";
+import { copyFileSync, existsSync, readFileSync, writeFileSync } from "fs";
+import { resolve } from "path";
+import { parse } from "@babel/parser";
+import traverseModule from "@babel/traverse";
+import MagicString from "magic-string";
 
 //#region src/utils/standalone-server.ts
 var StandaloneServer = class {
@@ -59,10 +64,10 @@ var StandaloneServer = class {
 		const startPort = options.port || 8888;
 		this.host = options.host || "localhost";
 		for (let port = startPort; port < startPort + 100; port++) try {
-			await new Promise((resolve, reject) => {
+			await new Promise((resolve$1, reject) => {
 				this.server.listen(port, this.host, () => {
 					this.port = port;
-					resolve();
+					resolve$1();
 				});
 				this.server.on("error", (err) => {
 					if (err.code === "EADDRINUSE") {
@@ -100,16 +105,447 @@ async function startStandaloneServer(options = {}) {
 	};
 }
 
+//#endregion
+//#region src/utils/config-detector.ts
+const CONFIG_PATTERNS = {
+	vite: [
+		"vite.config.ts",
+		"vite.config.js",
+		"vite.config.mjs"
+	],
+	webpack: ["webpack.config.ts", "webpack.config.js"],
+	nextjs: [
+		"next.config.ts",
+		"next.config.js",
+		"next.config.mjs"
+	]
+};
+/**
+* Auto-detect bundler configuration files in the given directory
+* @param cwd - Current working directory (defaults to process.cwd())
+* @returns Array of detected configurations
+*/
+function detectConfigs(cwd = process.cwd()) {
+	const detected = [];
+	for (const [bundler, patterns] of Object.entries(CONFIG_PATTERNS)) for (const pattern of patterns) {
+		const configPath = resolve(cwd, pattern);
+		if (existsSync(configPath)) {
+			detected.push({
+				path: configPath,
+				bundler,
+				exists: true
+			});
+			break;
+		}
+	}
+	return detected;
+}
+/**
+* Detect a specific bundler configuration
+* @param bundler - Bundler type to detect
+* @param cwd - Current working directory
+* @returns Detected config or null
+*/
+function detectConfig(bundler, cwd = process.cwd()) {
+	const patterns = CONFIG_PATTERNS[bundler];
+	for (const pattern of patterns) {
+		const configPath = resolve(cwd, pattern);
+		if (existsSync(configPath)) return {
+			path: configPath,
+			bundler,
+			exists: true
+		};
+	}
+	return null;
+}
+/**
+* Find config file by explicit path
+* @param configPath - Explicit path to config file
+* @returns Detected config or null
+*/
+function detectConfigByPath(configPath) {
+	if (!existsSync(configPath)) return null;
+	const fileName = configPath.split("/").pop() || "";
+	for (const [bundler, patterns] of Object.entries(CONFIG_PATTERNS)) if (patterns.some((pattern) => fileName.includes(pattern.split(".")[0]))) return {
+		path: configPath,
+		bundler,
+		exists: true
+	};
+	return null;
+}
+
+//#endregion
+//#region src/utils/codemod-transformer.ts
+const traverse = traverseModule.default || traverseModule;
+const PLUGIN_IMPORT = "@mcpc-tech/unplugin-dev-inspector-mcp";
+const PLUGIN_VAR_NAME = "DevInspector";
+/**
+* Check if DevInspector is already imported in the code
+*/
+function hasDevInspectorImport(code) {
+	return code.includes(PLUGIN_IMPORT);
+}
+/**
+* Transform Vite configuration to add DevInspector
+*/
+function transformViteConfig(options) {
+	const { configPath } = options;
+	try {
+		const code = readFileSync(configPath, "utf-8");
+		if (hasDevInspectorImport(code)) return {
+			success: true,
+			modified: false,
+			message: "DevInspector is already configured in this file"
+		};
+		const s = new MagicString(code);
+		const ast = parse(code, {
+			sourceType: "module",
+			plugins: ["typescript", "jsx"]
+		});
+		let lastImportEnd = 0;
+		let pluginsArrayStart = -1;
+		let firstPluginStart = -1;
+		let hasPluginsArray = false;
+		traverse(ast, {
+			ImportDeclaration(path$1) {
+				if (path$1.node.loc) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
+			},
+			ObjectProperty(path$1) {
+				if (path$1.node.key.type === "Identifier" && path$1.node.key.name === "plugins" && path$1.node.value.type === "ArrayExpression") {
+					hasPluginsArray = true;
+					if (path$1.node.value.start !== null && path$1.node.value.start !== void 0) {
+						pluginsArrayStart = path$1.node.value.start;
+						const elements = path$1.node.value.elements;
+						if (elements.length > 0 && elements[0]?.start !== null && elements[0]?.start !== void 0) firstPluginStart = elements[0].start;
+					}
+				}
+			}
+		});
+		const lines = code.split("\n");
+		const importLine = `import ${PLUGIN_VAR_NAME} from '${PLUGIN_IMPORT}';\n`;
+		if (lastImportEnd > 0) {
+			let insertPos = 0;
+			for (let i = 0; i < lastImportEnd; i++) insertPos += lines[i].length + 1;
+			s.appendLeft(insertPos, importLine);
+		} else s.prepend(importLine);
+		if (hasPluginsArray && firstPluginStart > -1) {
+			const pluginCall = `${PLUGIN_VAR_NAME}.vite({\n      enabled: true,\n    }),\n    `;
+			s.appendLeft(firstPluginStart, pluginCall);
+		} else if (hasPluginsArray && pluginsArrayStart > -1) {
+			const pluginCall = `\n    ${PLUGIN_VAR_NAME}.vite({\n      enabled: true,\n    }),\n  `;
+			s.appendLeft(pluginsArrayStart + 1, pluginCall);
+		} else return {
+			success: false,
+			modified: false,
+			error: "Could not find plugins array in config",
+			message: "Please add DevInspector manually to your plugins array"
+		};
+		return {
+			success: true,
+			modified: true,
+			code: s.toString(),
+			message: "Successfully added DevInspector to Vite config"
+		};
+	} catch (error) {
+		return {
+			success: false,
+			modified: false,
+			error: error instanceof Error ? error.message : String(error),
+			message: "Failed to transform Vite config"
+		};
+	}
+}
+/**
+* Transform Webpack configuration to add DevInspector
+*/
+function transformWebpackConfig(options) {
+	const { configPath } = options;
+	try {
+		const code = readFileSync(configPath, "utf-8");
+		if (hasDevInspectorImport(code)) return {
+			success: true,
+			modified: false,
+			message: "DevInspector is already configured in this file"
+		};
+		const s = new MagicString(code);
+		const isESM = code.includes("import ") && !code.includes("require(");
+		const ast = parse(code, {
+			sourceType: "module",
+			plugins: ["typescript"]
+		});
+		let lastImportEnd = 0;
+		let pluginsArrayStart = -1;
+		traverse(ast, {
+			ImportDeclaration(path$1) {
+				if (path$1.node.loc) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
+			},
+			VariableDeclaration(path$1) {
+				if (path$1.node.loc && !isESM) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
+			},
+			ObjectProperty(path$1) {
+				if (path$1.node.key.type === "Identifier" && path$1.node.key.name === "plugins" && path$1.node.value.type === "ArrayExpression") {
+					if (path$1.node.value.start !== null && path$1.node.value.start !== void 0) pluginsArrayStart = path$1.node.value.start;
+				}
+			}
+		});
+		const lines = code.split("\n");
+		const importLine = isESM ? `import ${PLUGIN_VAR_NAME} from '${PLUGIN_IMPORT}';\n` : `const ${PLUGIN_VAR_NAME} = require('${PLUGIN_IMPORT}');\n`;
+		if (lastImportEnd > 0) {
+			let insertPos = 0;
+			for (let i = 0; i < lastImportEnd; i++) insertPos += lines[i].length + 1;
+			s.appendLeft(insertPos, importLine);
+		} else s.prepend(importLine);
+		if (pluginsArrayStart > -1) {
+			const pluginCall = `\n    ${PLUGIN_VAR_NAME}.webpack({\n      enabled: true,\n    }),`;
+			s.appendLeft(pluginsArrayStart + 1, pluginCall);
+		} else return {
+			success: false,
+			modified: false,
+			error: "Could not find plugins array in config",
+			message: "Please add DevInspector manually to your plugins array"
+		};
+		return {
+			success: true,
+			modified: true,
+			code: s.toString(),
+			message: "Successfully added DevInspector to Webpack config"
+		};
+	} catch (error) {
+		return {
+			success: false,
+			modified: false,
+			error: error instanceof Error ? error.message : String(error),
+			message: "Failed to transform Webpack config"
+		};
+	}
+}
+/**
+* Transform Next.js configuration to add DevInspector
+*/
+function transformNextConfig(options) {
+	const { configPath } = options;
+	try {
+		const code = readFileSync(configPath, "utf-8");
+		if (hasDevInspectorImport(code)) return {
+			success: true,
+			modified: false,
+			message: "DevInspector is already configured in this file"
+		};
+		const s = new MagicString(code);
+		const ast = parse(code, {
+			sourceType: "module",
+			plugins: ["typescript"]
+		});
+		let lastImportEnd = 0;
+		let nextConfigStart = -1;
+		let hasWebpackProperty = false;
+		traverse(ast, {
+			ImportDeclaration(path$1) {
+				if (path$1.node.loc) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
+			},
+			VariableDeclarator(path$1) {
+				if (path$1.node.id.type === "Identifier" && path$1.node.id.name === "nextConfig" && path$1.node.init?.type === "ObjectExpression") {
+					if (path$1.node.init.start !== null && path$1.node.init.start !== void 0) nextConfigStart = path$1.node.init.start;
+					path$1.node.init.properties.forEach((prop) => {
+						if (prop.type === "ObjectProperty" && prop.key.type === "Identifier" && prop.key.name === "webpack") hasWebpackProperty = true;
+					});
+				}
+			}
+		});
+		const lines = code.split("\n");
+		const importLine = `import ${PLUGIN_VAR_NAME} from '${PLUGIN_IMPORT}';\n`;
+		if (lastImportEnd > 0) {
+			let insertPos = 0;
+			for (let i = 0; i < lastImportEnd; i++) insertPos += lines[i].length + 1;
+			s.appendLeft(insertPos, importLine);
+		} else s.prepend(importLine);
+		if (nextConfigStart > -1 && !hasWebpackProperty) {
+			const webpackConfig = `\n  webpack: (config) => {\n    config.plugins.push(\n      ${PLUGIN_VAR_NAME}.webpack({\n        enabled: true,\n      })\n    );\n    return config;\n  },`;
+			s.appendLeft(nextConfigStart + 1, webpackConfig);
+		} else if (hasWebpackProperty) return {
+			success: false,
+			modified: false,
+			message: "Webpack property already exists. Please add DevInspector manually to avoid conflicts"
+		};
+		else return {
+			success: false,
+			modified: false,
+			error: "Could not find nextConfig object",
+			message: "Please add DevInspector manually to your Next.js config"
+		};
+		return {
+			success: true,
+			modified: true,
+			code: s.toString(),
+			message: "Successfully added DevInspector to Next.js config"
+		};
+	} catch (error) {
+		return {
+			success: false,
+			modified: false,
+			error: error instanceof Error ? error.message : String(error),
+			message: "Failed to transform Next.js config"
+		};
+	}
+}
+/**
+* Main transform function that routes to the appropriate transformer
+*/
+function transformConfig(options) {
+	switch (options.bundler) {
+		case "vite": return transformViteConfig(options);
+		case "webpack": return transformWebpackConfig(options);
+		case "nextjs": return transformNextConfig(options);
+		default: return {
+			success: false,
+			modified: false,
+			error: `Unknown bundler type: ${options.bundler}`,
+			message: "Unsupported bundler type"
+		};
+	}
+}
+
 //#endregion
 //#region src/cli.ts
 /**
-* Standalone dev-inspector server for Turbopack/other non-webpack builds
+* CLI for dev-inspector
 * 
-* Usage:
-*   npx dev-inspector-server
-*   npx dev-inspector-server --port 8888 --host localhost
+* Commands:
+*   setup - Add DevInspector to your bundler config
+*   server - Start standalone MCP server (default)
 */
-async function main() {
+async function runSetupCommand() {
+	const args = process.argv.slice(3);
+	let dryRun = false;
+	let noBackup = false;
+	let configPath;
+	let bundlerType;
+	for (let i = 0; i < args.length; i++) if (args[i] === "--dry-run") dryRun = true;
+	else if (args[i] === "--no-backup") noBackup = true;
+	else if (args[i] === "--config" && args[i + 1]) {
+		configPath = args[i + 1];
+		i++;
+	} else if (args[i] === "--bundler" && args[i + 1]) {
+		bundlerType = args[i + 1];
+		i++;
+	} else if (args[i] === "--help" || args[i] === "-h") {
+		console.log(`
+╔══════════════════════════════════════════════════════════╗
+║           🔧 DevInspector Setup Command                  ║
+╠══════════════════════════════════════════════════════════╣
+║                                                          ║
+║  Automatically add DevInspector to your bundler config   ║
+║                                                          ║
+╚══════════════════════════════════════════════════════════╝
+
+Usage:
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup [options]
+
+Options:
+  --config <path>         Specify config file path (auto-detect by default)
+  --bundler <type>        Specify bundler type: vite, webpack, nextjs
+  --dry-run               Preview changes without applying them
+  --no-backup             Skip creating backup files
+  --help, -h              Show this help message
+
+Examples:
+  # Auto-detect and setup
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup
+
+  # Preview changes without applying
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --dry-run
+
+  # Setup specific config
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --config vite.config.ts
+
+  # Setup for specific bundler
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --bundler vite
+`);
+		process.exit(0);
+	}
+	console.log(`
+╔══════════════════════════════════════════════════════════╗
+║           🔧 DevInspector Setup                          ║
+╚══════════════════════════════════════════════════════════╝
+`);
+	try {
+		let targetConfig;
+		if (configPath) {
+			targetConfig = detectConfigByPath(configPath);
+			if (!targetConfig) {
+				console.error(`❌ Config file not found: ${configPath}`);
+				process.exit(1);
+			}
+		} else if (bundlerType) {
+			targetConfig = detectConfig(bundlerType);
+			if (!targetConfig) {
+				console.error(`❌ No ${bundlerType} config file found in current directory`);
+				process.exit(1);
+			}
+		} else {
+			const detected = detectConfigs();
+			if (detected.length === 0) {
+				console.error("❌ No bundler config files found in current directory");
+				console.log("\nSupported configs: vite.config.{ts,js,mjs}, webpack.config.{ts,js}, next.config.{ts,js,mjs}");
+				process.exit(1);
+			}
+			if (detected.length > 1) {
+				console.log("📦 Multiple configs detected:");
+				detected.forEach((config, i) => {
+					console.log(`  ${i + 1}. ${config.bundler}: ${config.path}`);
+				});
+				console.log("\n💡 Tip: Use --bundler or --config to specify which one to transform");
+				targetConfig = detected[0];
+				console.log(`\n🎯 Using: ${targetConfig.bundler} (${targetConfig.path})`);
+			} else {
+				targetConfig = detected[0];
+				console.log(`🎯 Detected: ${targetConfig.bundler} config at ${targetConfig.path}`);
+			}
+		}
+		console.log(`\n${dryRun ? "🔍 Previewing" : "🔧 Transforming"} ${targetConfig.bundler} config...`);
+		const result = transformConfig({
+			configPath: targetConfig.path,
+			bundler: targetConfig.bundler,
+			dryRun
+		});
+		if (!result.success) {
+			console.error(`\n❌ ${result.message}`);
+			if (result.error) console.error(`   Error: ${result.error}`);
+			process.exit(1);
+		}
+		if (!result.modified) {
+			console.log(`\n✅ ${result.message}`);
+			process.exit(0);
+		}
+		if (dryRun) {
+			console.log("\n📄 Preview of changes:");
+			console.log("─".repeat(60));
+			console.log(result.code);
+			console.log("─".repeat(60));
+			console.log("\n💡 Run without --dry-run to apply these changes");
+			process.exit(0);
+		}
+		if (!noBackup) {
+			const backupPath = `${targetConfig.path}.bak`;
+			copyFileSync(targetConfig.path, backupPath);
+			console.log(`📦 Backup created: ${backupPath}`);
+		}
+		writeFileSync(targetConfig.path, result.code, "utf-8");
+		console.log(`\n✅ ${result.message}`);
+		console.log(`\n📝 Next steps:`);
+		console.log(`   1. Review the changes in ${targetConfig.path}`);
+		console.log(`   2. Install the package: npm i -D @mcpc-tech/unplugin-dev-inspector-mcp`);
+		console.log(`   3. Start your dev server`);
+		if (targetConfig.bundler === "vite") {
+			console.log(`\n⚠️  Important: DevInspector should be placed BEFORE framework plugins (react/vue/svelte)`);
+			console.log(`   Please verify the plugin order in your config.`);
+		}
+	} catch (error) {
+		console.error("❌ Setup failed:", error instanceof Error ? error.message : error);
+		process.exit(1);
+	}
+}
+async function runServerCommand() {
 	const args = process.argv.slice(2);
 	let port = 8888;
 	let host = "localhost";
@@ -121,7 +557,14 @@ async function main() {
 		i++;
 	} else if (args[i] === "--help" || args[i] === "-h") {
 		console.log(`
-dev-inspector-server - Standalone MCP server for dev-inspector
+╔══════════════════════════════════════════════════════════╗
+║           🔍 DevInspector MCP Server                     ║
+╠══════════════════════════════════════════════════════════╣
+║                                                          ║
+║  Standalone MCP server for dev-inspector                 ║
+║  (for Turbopack and other non-webpack builds)            ║
+║                                                          ║
+╚══════════════════════════════════════════════════════════╝
 
 Usage:
   npx dev-inspector-server [options]
@@ -171,6 +614,25 @@ Example:
 		process.exit(1);
 	}
 }
+async function main() {
+	const command = process.argv[2];
+	if (command === "setup") await runSetupCommand();
+	else if (command === "server" || !command) await runServerCommand();
+	else {
+		console.log(`
+Unknown command: ${command}
+
+Available commands:
+  setup   - Add DevInspector to your bundler config
+  server  - Start standalone MCP server (default)
+
+Run with --help for more information:
+  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --help
+  npx dev-inspector-server --help
+`);
+		process.exit(1);
+	}
+}
 main();
 
 //#endregion