@mcp-use/cli 2.11.2 → 2.12.0-canary.0

package/dist/index.cjs

@@ -1132,6 +1132,7 @@ defineLazyProperty(apps, "safari", () => detectPlatformBinary({
 var open_default = open;
 
 // src/index.ts
+var import_vite_plugin_singlefile = require("vite-plugin-singlefile");
 var import_zod = require("zod");
 
 // src/commands/auth.ts
@@ -4551,6 +4552,9 @@ async function waitForServer(port, host = "localhost", maxAttempts = 30) {
   }
   return false;
 }
+function normalizeBrowserHost(host) {
+  return host === "0.0.0.0" ? "localhost" : host;
+}
 function runCommand(command, args, cwd, env2, filterStderr = false) {
   const proc = (0, import_node_child_process9.spawn)(command, args, {
     cwd,
@@ -4658,7 +4662,8 @@ async function findServerFile(projectPath) {
   }
   throw new Error("No server file found");
 }
-async function buildWidgets(projectPath) {
+async function buildWidgets(projectPath, options = {}) {
+  const { inline = true } = options;
   const { promises: fs10 } = await import("fs");
   const { build } = await import("vite");
   const resourcesDir = import_node_path6.default.join(projectPath, "resources");
@@ -4703,7 +4708,11 @@ async function buildWidgets(projectPath) {
     console.log(source_default.gray("No widgets found in resources/ directory"));
     return [];
   }
-  console.log(source_default.gray(`Building ${entries.length} widget(s)...`));
+  console.log(
+    source_default.gray(
+      `Building ${entries.length} widget(s)${inline ? " (inline mode for VS Code compatibility)" : ""}...`
+    )
+  );
   const react = (await import("@vitejs/plugin-react")).default;
   const tailwindcss = (await import("@tailwindcss/vite")).default;
   const packageJsonPath = import_node_path6.default.join(projectPath, "package.json");
@@ -4981,18 +4990,27 @@ export default {
           return null;
         }
       };
+      const buildPlugins = inline ? [
+        buildNodeStubsPlugin,
+        tailwindcss(),
+        react(),
+        (0, import_vite_plugin_singlefile.viteSingleFile)({ removeViteModuleLoader: true })
+      ] : [buildNodeStubsPlugin, tailwindcss(), react()];
       await build({
         root: tempDir,
         base: baseUrl,
-        plugins: [buildNodeStubsPlugin, tailwindcss(), react()],
-        experimental: {
-          renderBuiltUrl: (filename, { hostType }) => {
-            if (["js", "css"].includes(hostType)) {
-              return {
-                runtime: `window.__getFile(${JSON.stringify(filename)})`
-              };
-            } else {
-              return { relative: true };
+        plugins: buildPlugins,
+        // Only use renderBuiltUrl for non-inline builds (external assets need runtime URL resolution)
+        ...inline ? {} : {
+          experimental: {
+            renderBuiltUrl: (filename, { hostType }) => {
+              if (["js", "css"].includes(hostType)) {
+                return {
+                  runtime: `window.__getFile(${JSON.stringify(filename)})`
+                };
+              } else {
+                return { relative: true };
+              }
             }
           }
         },
@@ -5008,6 +5026,17 @@ export default {
         build: {
           outDir,
           emptyOutDir: true,
+          // Disable source maps to avoid CSP eval violations
+          // Source maps can use eval-based mappings which break strict CSP policies
+          sourcemap: false,
+          // Minify for smaller bundle size
+          minify: "esbuild",
+          // For inline builds, disable CSS code splitting and inline all assets
+          ...inline ? {
+            cssCodeSplit: false,
+            assetsInlineLimit: 1e8
+            // Inline all assets under 100MB (effectively all)
+          } : {},
           rollupOptions: {
             input: import_node_path6.default.join(tempDir, "index.html"),
             external: (id) => {
@@ -5016,6 +5045,40 @@ export default {
           }
         }
       });
+      try {
+        const assetsDir = import_node_path6.default.join(outDir, "assets");
+        const assetFiles = await fs10.readdir(assetsDir);
+        const jsFiles = assetFiles.filter((f) => f.endsWith(".js"));
+        for (const jsFile of jsFiles) {
+          const jsPath = import_node_path6.default.join(assetsDir, jsFile);
+          let content = await fs10.readFile(jsPath, "utf8");
+          const zodConfigPatterns = [
+            // Non-minified: export const globalConfig = {}
+            /export\s+const\s+globalConfig\s*=\s*\{\s*\}/g,
+            // Minified pattern: ZodEncodeError"}}const X={};function followed by return X
+            // This is the unique signature of Zod's globalConfig
+            /ZodEncodeError[^}]*\}\}const\s+([a-zA-Z_$][a-zA-Z0-9_$]*)\s*=\s*\{\s*\}/g
+          ];
+          let patched = false;
+          for (const pattern of zodConfigPatterns) {
+            if (pattern.test(content)) {
+              pattern.lastIndex = 0;
+              content = content.replace(pattern, (match) => {
+                return match.replace(/=\s*\{\s*\}/, "={jitless:true}");
+              });
+              patched = true;
+            }
+          }
+          if (patched) {
+            await fs10.writeFile(jsPath, content, "utf8");
+            console.log(source_default.gray(`    \u2192 Patched Zod JIT in ${jsFile}`));
+          }
+        }
+      } catch (error) {
+        if (error.code !== "ENOENT") {
+          console.warn(source_default.yellow(`    \u26A0 Failed to patch Zod JIT: ${error}`));
+        }
+      }
       const mcpServerUrl = process.env.MCP_SERVER_URL;
       if (mcpServerUrl) {
         try {
@@ -5069,12 +5132,17 @@ export default {
   );
   return builtWidgets;
 }
-program.command("build").description("Build TypeScript and MCP UI widgets").option("-p, --path <path>", "Path to project directory", process.cwd()).option("--with-inspector", "Include inspector in production build").action(async (options) => {
+program.command("build").description("Build TypeScript and MCP UI widgets").option("-p, --path <path>", "Path to project directory", process.cwd()).option("--with-inspector", "Include inspector in production build").option(
+  "--inline",
+  "Inline all JS/CSS into HTML (required for VS Code MCP Apps)"
+).option("--no-inline", "Keep JS/CSS as separate files (default)").action(async (options) => {
   try {
     const projectPath = import_node_path6.default.resolve(options.path);
     const { promises: fs10 } = await import("fs");
     displayPackageVersions(projectPath);
-    const builtWidgets = await buildWidgets(projectPath);
+    const builtWidgets = await buildWidgets(projectPath, {
+      inline: options.inline ?? false
+    });
     console.log(source_default.gray("Building TypeScript..."));
     await runCommand("npx", ["tsc"], projectPath);
     console.log(source_default.green("\u2713 TypeScript build complete!"));
@@ -5131,7 +5199,11 @@ program.command("build").description("Build TypeScript and MCP UI widgets").opti
     process.exit(1);
   }
 });
-program.command("dev").description("Run development server with auto-reload and inspector").option("-p, --path <path>", "Path to project directory", process.cwd()).option("--port <port>", "Server port", "3000").option("--host <host>", "Server host", "localhost").option("--no-open", "Do not auto-open inspector").option("--no-hmr", "Disable hot module reloading (use tsx watch instead)").action(async (options) => {
+program.command("dev").description("Run development server with auto-reload and inspector").option("-p, --path <path>", "Path to project directory", process.cwd()).option("--port <port>", "Server port", "3000").option(
+  "--host <host>",
+  "Server host (use 0.0.0.0 to listen on all interfaces)",
+  "0.0.0.0"
+).option("--no-open", "Do not auto-open inspector").option("--no-hmr", "Disable hot module reloading (use tsx watch instead)").action(async (options) => {
   try {
     const projectPath = import_node_path6.default.resolve(options.path);
     let port = parseInt(options.port, 10);
@@ -5195,11 +5267,14 @@ program.command("dev").description("Run development server with auto-reload and
         const startTime = Date.now();
         const ready = await waitForServer(port, host);
         if (ready) {
-          const mcpEndpoint = `http://${host}:${port}/mcp`;
-          const inspectorUrl = `http://${host}:${port}/inspector?autoConnect=${encodeURIComponent(mcpEndpoint)}`;
+          const browserHost = normalizeBrowserHost(host);
+          const mcpEndpoint = `http://${browserHost}:${port}/mcp`;
+          const inspectorUrl = `http://${browserHost}:${port}/inspector?autoConnect=${encodeURIComponent(mcpEndpoint)}`;
           const readyTime = Date.now() - startTime;
           console.log(source_default.green.bold(`\u2713 Ready in ${readyTime}ms`));
-          console.log(source_default.whiteBright(`Local:    http://${host}:${port}`));
+          console.log(
+            source_default.whiteBright(`Local:    http://${browserHost}:${port}`)
+          );
           console.log(source_default.whiteBright(`Network:  http://${host}:${port}`));
           console.log(source_default.whiteBright(`MCP:      ${mcpEndpoint}`));
           console.log(source_default.whiteBright(`Inspector: ${inspectorUrl}
@@ -5283,11 +5358,14 @@ program.command("dev").description("Run development server with auto-reload and
       if (options.open !== false) {
         const ready = await waitForServer(port, host);
         if (ready) {
-          const mcpEndpoint = `http://${host}:${port}/mcp`;
-          const inspectorUrl = `http://${host}:${port}/inspector?autoConnect=${encodeURIComponent(mcpEndpoint)}`;
+          const browserHost = normalizeBrowserHost(host);
+          const mcpEndpoint = `http://${browserHost}:${port}/mcp`;
+          const inspectorUrl = `http://${browserHost}:${port}/inspector?autoConnect=${encodeURIComponent(mcpEndpoint)}`;
           const readyTime = Date.now() - startTime;
           console.log(source_default.green.bold(`\u2713 Ready in ${readyTime}ms`));
-          console.log(source_default.whiteBright(`Local:    http://${host}:${port}`));
+          console.log(
+            source_default.whiteBright(`Local:    http://${browserHost}:${port}`)
+          );
           console.log(source_default.whiteBright(`Network:  http://${host}:${port}`));
           console.log(source_default.whiteBright(`MCP:      ${mcpEndpoint}`));
           console.log(source_default.whiteBright(`Inspector: ${inspectorUrl}`));