@cloudflare/vite-plugin 0.0.6 → 0.0.7

package/dist/index.js

@@ -3,16 +3,6 @@ import assert7 from "node:assert";
 import * as fs4 from "node:fs";
 import * as path6 from "node:path";
 import { createMiddleware } from "@hattip/adapter-node";
-import { Miniflare } from "miniflare";
-import "vite";
-
-// src/cloudflare-environment.ts
-import assert from "node:assert";
-import { builtinModules } from "node:module";
-import * as vite2 from "vite";
-
-// src/node-js-compat.ts
-import { createRequire } from "node:module";
 
 // ../../node_modules/.pnpm/@jridgewell+sourcemap-codec@1.5.0/node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.mjs
 var comma = ",".charCodeAt(0);
@@ -1078,7 +1068,17 @@ var MagicString = class _MagicString {
   }
 };
 
+// src/index.ts
+import { Miniflare } from "miniflare";
+import * as vite6 from "vite";
+
+// src/cloudflare-environment.ts
+import assert from "node:assert";
+import { builtinModules } from "node:module";
+import * as vite2 from "vite";
+
 // src/node-js-compat.ts
+import { createRequire } from "node:module";
 import { getNodeCompat } from "miniflare";
 import * as unenv from "unenv";
 var require2 = createRequire(import.meta.url);
@@ -1169,9 +1169,16 @@ function resolveNodeAliases(source, workerConfig) {
   return alias;
 }
 
+// src/constants.ts
+var ROUTER_WORKER_NAME = "__router-worker__";
+var ASSET_WORKER_NAME = "__asset-worker__";
+var ASSET_WORKERS_COMPATIBILITY_DATE = "2024-10-04";
+var MODULE_TYPES = ["CompiledWasm"];
+
 // src/shared.ts
 var UNKNOWN_HOST = "http://localhost";
 var INIT_PATH = "/__vite_plugin_cloudflare_init__";
+var MODULE_PATTERN = `__CLOUDFLARE_MODULE__(${MODULE_TYPES.join("|")})__(.*?)__`;
 
 // src/utils.ts
 import * as path from "node:path";
@@ -1284,6 +1291,7 @@ var cloudflareBuiltInModules = [
   "cloudflare:workers",
   "cloudflare:workflows"
 ];
+var defaultConditions = ["workerd", "module", "browser"];
 function createCloudflareEnvironmentOptions(workerConfig, userConfig, environmentName) {
   return {
     resolve: {
@@ -1291,7 +1299,7 @@ function createCloudflareEnvironmentOptions(workerConfig, userConfig, environmen
       //       dependencies as not external
       noExternal: true,
       // We want to use `workerd` package exports if available (e.g. for postgres).
-      conditions: ["workerd", "module", "browser", "development|production"]
+      conditions: [...defaultConditions, "development|production"]
     },
     dev: {
       createEnvironment(name2, config) {
@@ -1302,7 +1310,11 @@ function createCloudflareEnvironmentOptions(workerConfig, userConfig, environmen
       createEnvironment(name2, config) {
         return new vite2.BuildEnvironment(name2, config);
       },
+      target: "es2022",
+      // We need to enable `emitAssets` in order to support additional modules defined by `rules`
+      emitAssets: true,
       outDir: getOutputDirectory(userConfig, environmentName),
+      copyPublicDir: false,
       ssr: true,
       rollupOptions: {
         // Note: vite starts dev pre-bundling crawling from either optimizeDeps.entries or rollupOptions.input
@@ -1323,6 +1335,7 @@ function createCloudflareEnvironmentOptions(workerConfig, userConfig, environmen
       ],
       esbuildOptions: {
         platform: "neutral",
+        conditions: [...defaultConditions, "development"],
         resolveExtensions: [
           ".mjs",
           ".js",
@@ -1433,13 +1446,6 @@ function writeDeployConfig(resolvedPluginConfig, resolvedViteConfig) {
 
 // src/dev.ts
 import assert3 from "node:assert";
-
-// src/constants.ts
-var ROUTER_WORKER_NAME = "__router-worker__";
-var ASSET_WORKER_NAME = "__asset-worker__";
-var ASSET_WORKERS_COMPATIBILITY_DATE = "2024-10-04";
-
-// src/dev.ts
 function getDevEntryWorker(resolvedPluginConfig, miniflare) {
   const entryWorkerConfig = resolvedPluginConfig.type === "assets-only" ? resolvedPluginConfig.config : resolvedPluginConfig.workers[resolvedPluginConfig.entryWorkerEnvironmentName];
   assert3(entryWorkerConfig, "Unexpected error: No entry worker configuration");
@@ -1669,16 +1675,24 @@ function getDevMiniflareOptions(resolvedPluginConfig, viteDevServer) {
               `Invalid invoke event: ${invokePayloadData.name}`
             );
             const [moduleId] = invokePayloadData.data;
+            const moduleRE = new RegExp(MODULE_PATTERN);
+            if (moduleRE.test(moduleId)) {
+              const result2 = {
+                externalize: moduleId,
+                type: "module"
+              };
+              return MiniflareResponse.json({ result: result2 });
+            }
             if (moduleId.startsWith("cloudflare:")) {
               const result2 = {
                 externalize: moduleId,
                 type: "builtin"
               };
-              return new MiniflareResponse(JSON.stringify({ result: result2 }));
+              return MiniflareResponse.json({ result: result2 });
             }
             const devEnvironment = viteDevServer.environments[environmentName];
             const result = await devEnvironment.hot.handleInvoke(payload);
-            return new MiniflareResponse(JSON.stringify(result));
+            return MiniflareResponse.json(result);
           }
         }
       };
@@ -1757,10 +1771,37 @@ function getDevMiniflareOptions(resolvedPluginConfig, viteDevServer) {
                 fileURLToPath(new URL(RUNNER_PATH, import.meta.url))
               )
             }
-          ]
+          ],
+          unsafeUseModuleFallbackService: true
         };
       })
-    ]
+    ],
+    unsafeModuleFallbackService(request) {
+      const url = new URL(request.url);
+      const rawSpecifier = url.searchParams.get("rawSpecifier");
+      assert4(
+        rawSpecifier,
+        `Unexpected error: no specifier in request to module fallback service.`
+      );
+      const moduleRE = new RegExp(MODULE_PATTERN);
+      const match = moduleRE.exec(rawSpecifier);
+      assert4(match, `Unexpected error: no match for module ${rawSpecifier}.`);
+      const [full, moduleType, modulePath] = match;
+      assert4(
+        modulePath,
+        `Unexpected error: module path not found in reference ${full}.`
+      );
+      let source;
+      try {
+        source = fs2.readFileSync(modulePath);
+      } catch (error) {
+        throw new Error(`Import ${modulePath} not found. Does the file exist?`);
+      }
+      return MiniflareResponse.json({
+        // Cap'n Proto expects byte arrays for `:Data` typed fields from JSON
+        wasm: Array.from(source)
+      });
+    }
   };
 }
 function getPreviewMiniflareOptions(vitePreviewServer, persistState) {
@@ -2176,8 +2217,10 @@ ${event.error?.stack || event.error?.message}`,
           workerWebSocket.addEventListener("close", () => {
             clientWebSocket.close();
           });
-          clientWebSocket.on("message", (event) => {
-            workerWebSocket.send(event);
+          clientWebSocket.on("message", (data, isBinary) => {
+            workerWebSocket.send(
+              isBinary ? Array.isArray(data) ? Buffer.concat(data) : data : data.toString()
+            );
           });
           clientWebSocket.on("error", (error) => {
             logger.error(`WebSocket error:
@@ -2201,228 +2244,312 @@ function cloudflare2(pluginConfig = {}) {
   let resolvedViteConfig;
   let miniflare;
   let workersConfigsWarningShown = false;
-  return {
-    name: "vite-plugin-cloudflare",
-    config(userConfig, env2) {
-      if (env2.isPreview) {
-        return { appType: "custom" };
-      }
-      resolvedPluginConfig = resolvePluginConfig(pluginConfig, userConfig, env2);
-      if (!workersConfigsWarningShown) {
-        workersConfigsWarningShown = true;
-        const workersConfigsWarning = getWarningForWorkersConfigs(
-          resolvedPluginConfig.rawConfigs
+  return [
+    {
+      name: "vite-plugin-cloudflare",
+      config(userConfig, env2) {
+        if (env2.isPreview) {
+          return { appType: "custom" };
+        }
+        resolvedPluginConfig = resolvePluginConfig(
+          pluginConfig,
+          userConfig,
+          env2
         );
-        if (workersConfigsWarning) {
-          console.warn(workersConfigsWarning);
+        if (!workersConfigsWarningShown) {
+          workersConfigsWarningShown = true;
+          const workersConfigsWarning = getWarningForWorkersConfigs(
+            resolvedPluginConfig.rawConfigs
+          );
+          if (workersConfigsWarning) {
+            console.warn(workersConfigsWarning);
+          }
         }
-      }
-      return {
-        appType: "custom",
-        resolve: {
-          alias: getNodeCompatAliases()
-        },
-        environments: resolvedPluginConfig.type === "workers" ? {
-          ...Object.fromEntries(
-            Object.entries(resolvedPluginConfig.workers).map(
-              ([environmentName, workerConfig]) => {
-                return [
-                  environmentName,
-                  createCloudflareEnvironmentOptions(
-                    workerConfig,
-                    userConfig,
-                    environmentName
+        return {
+          appType: "custom",
+          resolve: {
+            alias: getNodeCompatAliases()
+          },
+          environments: resolvedPluginConfig.type === "workers" ? {
+            ...Object.fromEntries(
+              Object.entries(resolvedPluginConfig.workers).map(
+                ([environmentName, workerConfig]) => {
+                  return [
+                    environmentName,
+                    createCloudflareEnvironmentOptions(
+                      workerConfig,
+                      userConfig,
+                      environmentName
+                    )
+                  ];
+                }
+              )
+            ),
+            client: {
+              build: {
+                outDir: getOutputDirectory(userConfig, "client")
+              }
+            }
+          } : void 0,
+          builder: {
+            async buildApp(builder) {
+              const clientEnvironment = builder.environments.client;
+              const defaultHtmlPath = path6.resolve(
+                builder.config.root,
+                "index.html"
+              );
+              if (clientEnvironment && (clientEnvironment.config.build.rollupOptions.input || fs4.existsSync(defaultHtmlPath))) {
+                await builder.build(clientEnvironment);
+              }
+              if (resolvedPluginConfig.type === "workers") {
+                const workerEnvironments = Object.keys(
+                  resolvedPluginConfig.workers
+                ).map((environmentName) => {
+                  const environment = builder.environments[environmentName];
+                  assert7(
+                    environment,
+                    `${environmentName} environment not found`
+                  );
+                  return environment;
+                });
+                await Promise.all(
+                  workerEnvironments.map(
+                    (environment) => builder.build(environment)
                   )
-                ];
+                );
               }
-            )
-          ),
-          client: {
-            build: {
-              outDir: getOutputDirectory(userConfig, "client")
+              writeDeployConfig(resolvedPluginConfig, resolvedViteConfig);
             }
           }
-        } : void 0,
-        builder: {
-          async buildApp(builder) {
-            const clientEnvironment = builder.environments.client;
-            const defaultHtmlPath = path6.resolve(
-              builder.config.root,
-              "index.html"
+        };
+      },
+      configResolved(config) {
+        resolvedViteConfig = config;
+      },
+      async resolveId(source) {
+        if (resolvedPluginConfig.type === "assets-only") {
+          return;
+        }
+        const workerConfig = resolvedPluginConfig.workers[this.environment.name];
+        if (!workerConfig) {
+          return;
+        }
+        return resolveNodeCompatId(this.environment, workerConfig, source);
+      },
+      async transform(code, id) {
+        if (resolvedPluginConfig.type === "assets-only") {
+          return;
+        }
+        const workerConfig = resolvedPluginConfig.workers[this.environment.name];
+        if (!workerConfig) {
+          return;
+        }
+        const resolvedId = await this.resolve(workerConfig.main);
+        if (id === resolvedId?.id) {
+          return injectGlobalCode(id, code, workerConfig);
+        }
+      },
+      generateBundle(_, bundle) {
+        let config;
+        if (resolvedPluginConfig.type === "workers") {
+          const workerConfig = resolvedPluginConfig.workers[this.environment.name];
+          const entryChunk = Object.entries(bundle).find(
+            ([_2, chunk]) => chunk.type === "chunk" && chunk.isEntry
+          );
+          if (!workerConfig || !entryChunk) {
+            return;
+          }
+          workerConfig.main = entryChunk[0];
+          const isEntryWorker = this.environment.name === resolvedPluginConfig.entryWorkerEnvironmentName;
+          if (isEntryWorker && workerConfig.assets) {
+            const workerOutputDirectory = this.environment.config.build.outDir;
+            const clientOutputDirectory = resolvedViteConfig.environments.client?.build.outDir;
+            assert7(
+              clientOutputDirectory,
+              "Unexpected error: client output directory is undefined"
             );
-            if (clientEnvironment && (clientEnvironment.config.build.rollupOptions.input || fs4.existsSync(defaultHtmlPath))) {
-              await builder.build(clientEnvironment);
-            }
-            if (resolvedPluginConfig.type === "workers") {
-              const workerEnvironments = Object.keys(
-                resolvedPluginConfig.workers
-              ).map((environmentName) => {
-                const environment = builder.environments[environmentName];
-                assert7(environment, `${environmentName} environment not found`);
-                return environment;
+            workerConfig.assets.directory = path6.relative(
+              path6.resolve(resolvedViteConfig.root, workerOutputDirectory),
+              path6.resolve(resolvedViteConfig.root, clientOutputDirectory)
+            );
+          }
+          config = workerConfig;
+          if (workerConfig.configPath) {
+            const dotDevDotVarsContent = getDotDevDotVarsContent(
+              workerConfig.configPath,
+              resolvedPluginConfig.cloudflareEnv
+            );
+            if (dotDevDotVarsContent) {
+              this.emitFile({
+                type: "asset",
+                fileName: ".dev.vars",
+                source: dotDevDotVarsContent
               });
-              await Promise.all(
-                workerEnvironments.map(
-                  (environment) => builder.build(environment)
-                )
-              );
             }
-            writeDeployConfig(resolvedPluginConfig, resolvedViteConfig);
           }
+        } else if (this.environment.name === "client") {
+          const assetsOnlyConfig = resolvedPluginConfig.config;
+          assetsOnlyConfig.assets.directory = ".";
+          const filesToAssetsIgnore = ["wrangler.json", ".dev.vars"];
+          this.emitFile({
+            type: "asset",
+            fileName: ".assetsignore",
+            source: `${filesToAssetsIgnore.join("\n")}
+`
+          });
+          config = assetsOnlyConfig;
         }
-      };
-    },
-    configResolved(config) {
-      resolvedViteConfig = config;
-    },
-    async resolveId(source) {
-      if (resolvedPluginConfig.type === "assets-only") {
-        return;
-      }
-      const workerConfig = resolvedPluginConfig.workers[this.environment.name];
-      if (!workerConfig) {
-        return;
-      }
-      return resolveNodeCompatId(this.environment, workerConfig, source);
-    },
-    async transform(code, id) {
-      if (resolvedPluginConfig.type === "assets-only") {
-        return;
-      }
-      const workerConfig = resolvedPluginConfig.workers[this.environment.name];
-      if (!workerConfig) {
-        return;
-      }
-      const resolvedId = await this.resolve(workerConfig.main);
-      if (id === resolvedId?.id) {
-        return injectGlobalCode(id, code, workerConfig);
+        if (!config) {
+          return;
+        }
+        config.no_bundle = true;
+        config.rules = [{ type: "ESModule", globs: ["**/*.js"] }];
+        if (config.unsafe && Object.keys(config.unsafe).length === 0) {
+          config.unsafe = void 0;
+        }
+        this.emitFile({
+          type: "asset",
+          fileName: "wrangler.json",
+          source: JSON.stringify(config)
+        });
+      },
+      handleHotUpdate(options) {
+        if (resolvedPluginConfig.configPaths.has(options.file)) {
+          options.server.restart();
+        }
+      },
+      async buildEnd() {
+        if (miniflare) {
+          await miniflare.dispose();
+          miniflare = void 0;
+        }
+      },
+      async configureServer(viteDevServer) {
+        assert7(
+          viteDevServer.httpServer,
+          "Unexpected error: No Vite HTTP server"
+        );
+        miniflare = new Miniflare(
+          getDevMiniflareOptions(resolvedPluginConfig, viteDevServer)
+        );
+        await initRunners(resolvedPluginConfig, viteDevServer, miniflare);
+        const entryWorker = await getDevEntryWorker(
+          resolvedPluginConfig,
+          miniflare
+        );
+        const middleware = createMiddleware(({ request }) => {
+          return entryWorker.fetch(toMiniflareRequest(request), {
+            redirect: "manual"
+          });
+        });
+        handleWebSocket(
+          viteDevServer.httpServer,
+          entryWorker.fetch,
+          viteDevServer.config.logger
+        );
+        return () => {
+          viteDevServer.middlewares.use((req, res, next) => {
+            middleware(req, res, next);
+          });
+        };
+      },
+      configurePreviewServer(vitePreviewServer) {
+        const miniflare2 = new Miniflare(
+          getPreviewMiniflareOptions(
+            vitePreviewServer,
+            pluginConfig.persistState ?? true
+          )
+        );
+        const middleware = createMiddleware(({ request }) => {
+          return miniflare2.dispatchFetch(toMiniflareRequest(request), {
+            redirect: "manual"
+          });
+        });
+        handleWebSocket(
+          vitePreviewServer.httpServer,
+          miniflare2.dispatchFetch,
+          vitePreviewServer.config.logger
+        );
+        return () => {
+          vitePreviewServer.middlewares.use((req, res, next) => {
+            middleware(req, res, next);
+          });
+        };
       }
     },
-    generateBundle(_, bundle) {
-      let config;
-      if (resolvedPluginConfig.type === "workers") {
-        const workerConfig = resolvedPluginConfig.workers[this.environment.name];
-        const entryChunk = Object.entries(bundle).find(
-          ([_2, chunk]) => chunk.type === "chunk" && chunk.isEntry
+    // Plugin to support `CompiledWasm` modules
+    {
+      name: "vite-plugin-cloudflare:modules",
+      // We set `enforce: "pre"` so that this plugin runs before the Vite core plugins.
+      // Otherwise the `vite:wasm-fallback` plugin prevents the `.wasm` extension being used for module imports.
+      enforce: "pre",
+      applyToEnvironment(environment) {
+        if (resolvedPluginConfig.type === "assets-only") {
+          return false;
+        }
+        return Object.keys(resolvedPluginConfig.workers).includes(
+          environment.name
         );
-        if (!workerConfig || !entryChunk) {
+      },
+      async resolveId(source, importer) {
+        if (!source.endsWith(".wasm")) {
           return;
         }
-        workerConfig.main = entryChunk[0];
-        const isEntryWorker = this.environment.name === resolvedPluginConfig.entryWorkerEnvironmentName;
-        if (isEntryWorker && workerConfig.assets) {
-          const workerOutputDirectory = this.environment.config.build.outDir;
-          const clientOutputDirectory = resolvedViteConfig.environments.client?.build.outDir;
+        const resolved = await this.resolve(source, importer);
+        assert7(
+          resolved,
+          `Unexpected error: could not resolve Wasm module ${source}`
+        );
+        return {
+          external: true,
+          id: createModuleReference("CompiledWasm", resolved.id)
+        };
+      },
+      renderChunk(code, chunk) {
+        const moduleRE = new RegExp(MODULE_PATTERN, "g");
+        let match;
+        let magicString;
+        while (match = moduleRE.exec(code)) {
+          magicString ??= new MagicString(code);
+          const [full, moduleType, modulePath] = match;
           assert7(
-            clientOutputDirectory,
-            "Unexpected error: client output directory is undefined"
+            modulePath,
+            `Unexpected error: module path not found in reference ${full}.`
           );
-          workerConfig.assets.directory = path6.relative(
-            path6.resolve(resolvedViteConfig.root, workerOutputDirectory),
-            path6.resolve(resolvedViteConfig.root, clientOutputDirectory)
+          let source;
+          try {
+            source = fs4.readFileSync(modulePath);
+          } catch (error) {
+            throw new Error(
+              `Import ${modulePath} not found. Does the file exist?`
+            );
+          }
+          const referenceId = this.emitFile({
+            type: "asset",
+            name: path6.basename(modulePath),
+            originalFileName: modulePath,
+            source
+          });
+          const emittedFileName = this.getFileName(referenceId);
+          const relativePath = vite6.normalizePath(
+            path6.relative(path6.dirname(chunk.fileName), emittedFileName)
           );
-        }
-        config = workerConfig;
-        if (workerConfig.configPath) {
-          const dotDevDotVarsContent = getDotDevDotVarsContent(
-            workerConfig.configPath,
-            resolvedPluginConfig.cloudflareEnv
+          const importPath = relativePath.startsWith(".") ? relativePath : `./${relativePath}`;
+          magicString.update(
+            match.index,
+            match.index + full.length,
+            importPath
           );
-          if (dotDevDotVarsContent) {
-            this.emitFile({
-              type: "asset",
-              fileName: ".dev.vars",
-              source: dotDevDotVarsContent
-            });
-          }
         }
-      } else if (this.environment.name === "client") {
-        const assetsOnlyConfig = resolvedPluginConfig.config;
-        assetsOnlyConfig.assets.directory = ".";
-        const filesToAssetsIgnore = ["wrangler.json", ".dev.vars"];
-        this.emitFile({
-          type: "asset",
-          fileName: ".assetsignore",
-          source: `${filesToAssetsIgnore.join("\n")}
-`
-        });
-        config = assetsOnlyConfig;
-      }
-      if (!config) {
-        return;
-      }
-      config.no_bundle = true;
-      config.rules = [{ type: "ESModule", globs: ["**/*.js"] }];
-      if (config.unsafe && Object.keys(config.unsafe).length === 0) {
-        config.unsafe = void 0;
-      }
-      this.emitFile({
-        type: "asset",
-        fileName: "wrangler.json",
-        source: JSON.stringify(config)
-      });
-    },
-    handleHotUpdate(options) {
-      if (resolvedPluginConfig.configPaths.has(options.file)) {
-        options.server.restart();
-      }
-    },
-    async buildEnd() {
-      if (miniflare) {
-        await miniflare.dispose();
-        miniflare = void 0;
+        if (magicString) {
+          return {
+            code: magicString.toString(),
+            map: this.environment.config.build.sourcemap ? magicString.generateMap({ hires: "boundary" }) : null
+          };
+        }
       }
-    },
-    async configureServer(viteDevServer) {
-      assert7(viteDevServer.httpServer, "Unexpected error: No Vite HTTP server");
-      miniflare = new Miniflare(
-        getDevMiniflareOptions(resolvedPluginConfig, viteDevServer)
-      );
-      await initRunners(resolvedPluginConfig, viteDevServer, miniflare);
-      const entryWorker = await getDevEntryWorker(
-        resolvedPluginConfig,
-        miniflare
-      );
-      const middleware = createMiddleware(({ request }) => {
-        return entryWorker.fetch(toMiniflareRequest(request), {
-          redirect: "manual"
-        });
-      });
-      handleWebSocket(
-        viteDevServer.httpServer,
-        entryWorker.fetch,
-        viteDevServer.config.logger
-      );
-      return () => {
-        viteDevServer.middlewares.use((req, res, next) => {
-          middleware(req, res, next);
-        });
-      };
-    },
-    configurePreviewServer(vitePreviewServer) {
-      const miniflare2 = new Miniflare(
-        getPreviewMiniflareOptions(
-          vitePreviewServer,
-          pluginConfig.persistState ?? true
-        )
-      );
-      const middleware = createMiddleware(({ request }) => {
-        return miniflare2.dispatchFetch(toMiniflareRequest(request), {
-          redirect: "manual"
-        });
-      });
-      handleWebSocket(
-        vitePreviewServer.httpServer,
-        miniflare2.dispatchFetch,
-        vitePreviewServer.config.logger
-      );
-      return () => {
-        vitePreviewServer.middlewares.use((req, res, next) => {
-          middleware(req, res, next);
-        });
-      };
     }
-  };
+  ];
 }
 function getDotDevDotVarsContent(configPath, cloudflareEnv) {
   const configDir = path6.dirname(configPath);
@@ -2435,6 +2562,9 @@ function getDotDevDotVarsContent(configPath, cloudflareEnv) {
   }
   return null;
 }
+function createModuleReference(type, id) {
+  return `__CLOUDFLARE_MODULE__${type}__${id}__`;
+}
 export {
   cloudflare2 as cloudflare
 };