feat(cloudflare-module, cloudflare-pages): experimental dynamic impor…

…ts (#1172)

Co-authored-by: Pooya Parsa <pooya@pi0.io>
Co-authored-by: Dario Piotrowicz <dario.piotrowicz@gmail.com>

docs/content/2.deploy/providers/cloudflare.md

@@ -294,4 +294,31 @@ NITRO_HELLO_THERE="captain"
 SECRET="top-secret"
 ```
 
+## Advanced
 
+### Experimental Dynamic Imports
+
+By default cloudflare presets output to a single bundle file.
+
+In order to try experimental dynamic imports you need to set the `NITRO_EXP_CLOUDFLARE_DYNAMIC_IMPORTS` environment variable for build command.
+
+::alert{type="warning"}
+This is an experimental mode and is likely not working at the moment!
+::
+
+With `cloudflare_module` preset, you need to add the following rule to your `wrangler.toml` file:
+
+```diff [wrangler.toml]
+  name = "playground"
+  main = "./.output/server/index.mjs"
+  workers_dev = true
+  compatibility_date = "2022-09-10"
+  account_id = "<the account_id you obtained (optional)>"
+  route = "<mainly useful when you want to setup custom domains (optional too)>"
++ rules = [
++   { type = "ESModule", globs = ["**/*.js", "**/*.mjs"]},
++ ]
+
+  [site]
+  bucket = ".output/public"
+```

src/presets/cloudflare-module.ts

@@ -1,3 +1,4 @@
+import { readFile } from "node:fs/promises";
 import { resolve } from "pathe";
 import { writeFile } from "../utils";
 import { defineNitroPreset } from "../preset";
@@ -19,6 +20,14 @@ export const cloudflareModule = defineNitroPreset({
     },
   },
   hooks: {
+    "rollup:before"(_nitro, rollupConfig) {
+      if (process.env.NITRO_EXP_CLOUDFLARE_DYNAMIC_IMPORTS) {
+        rollupConfig.output = {
+          ...rollupConfig.output,
+          inlineDynamicImports: false,
+        };
+      }
+    },
     async compiled(nitro: Nitro) {
       await writeFile(
         resolve(nitro.options.output.dir, "package.json"),

src/presets/cloudflare-pages.ts

@@ -30,6 +30,16 @@ export const cloudflarePages = defineNitroPreset({
     },
   },
   hooks: {
+    "rollup:before"(nitro, rollupConfig) {
+      if (process.env.NITRO_EXP_CLOUDFLARE_DYNAMIC_IMPORTS) {
+        rollupConfig.output = {
+          ...rollupConfig.output,
+          entryFileNames: "index.js",
+          dir: resolve(nitro.options.output.serverDir, "_worker.js"),
+          inlineDynamicImports: false,
+        };
+      }
+    },
     async compiled(nitro: Nitro) {
       await writeCFRoutes(nitro);
     },