From db3da8ca75e981bc929800623828d2f36f7e1239 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Wed, 19 Apr 2023 11:34:15 +0100 Subject: [PATCH 1/9] feat(cloudflare): enable dynamic imports for worker modules --- src/presets/cloudflare-module.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index 8b68f047e6..8de8c4aecf 100644 --- a/src/presets/cloudflare-module.ts +++ b/src/presets/cloudflare-module.ts @@ -7,14 +7,15 @@ export const cloudflareModule = defineNitroPreset({ extends: "base-worker", entry: "#internal/nitro/entries/cloudflare-module", commands: { - preview: "npx wrangler dev ./server/index.mjs --site ./public --local", - deploy: "npx wrangler publish", + preview: "npx wrangler dev ./server/index.mjs --site ./public --local --no-bundle", + deploy: "npx wrangler publish --no-bundle", }, rollupConfig: { external: "__STATIC_CONTENT_MANIFEST", output: { format: "esm", exports: "named", + inlineDynamicImports: false, }, }, hooks: { From 917ca8480036daa99181314622d4077407a07d29 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 19 Apr 2023 10:36:43 +0000 Subject: [PATCH 2/9] [autofix.ci] apply automated fixes --- src/presets/cloudflare-module.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index 8de8c4aecf..59cee790c1 100644 --- a/src/presets/cloudflare-module.ts +++ b/src/presets/cloudflare-module.ts @@ -7,7 +7,8 @@ export const cloudflareModule = defineNitroPreset({ extends: "base-worker", entry: "#internal/nitro/entries/cloudflare-module", commands: { - preview: "npx wrangler dev ./server/index.mjs --site ./public --local --no-bundle", + preview: + "npx wrangler dev ./server/index.mjs --site ./public --local --no-bundle", deploy: "npx wrangler publish --no-bundle", }, rollupConfig: { From 84029bfbc19df07c88d0c9be9929f84bfdf2dfcf Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Wed, 19 Apr 2023 11:45:45 +0100 Subject: [PATCH 3/9] docs: document `rules` requirement --- docs/content/2.deploy/providers/cloudflare.md | 17 +++++++++++++++++ src/presets/cloudflare-module.ts | 5 +++++ 2 files changed, 22 insertions(+) diff --git a/docs/content/2.deploy/providers/cloudflare.md b/docs/content/2.deploy/providers/cloudflare.md index f3a12abd48..1fc1de5d01 100644 --- a/docs/content/2.deploy/providers/cloudflare.md +++ b/docs/content/2.deploy/providers/cloudflare.md @@ -185,6 +185,23 @@ wrangler pages publish **Note:** This preset uses [module syntax](https://developers.cloudflare.com/workers/learning/migrating-to-module-workers/) for deployment. :: +This preset enables dynamic imports by default. You will need to add the following rule to your `wrangler.toml`: + +```diff + name = "playground" + main = "./.output/server/index.mjs" + workers_dev = true + compatibility_date = "2022-09-10" + account_id = "" + route = "" ++ rules = [ ++ { type = "ESModule", globs = ["**/*.js", "**/*.mjs"]}, ++ ] + + [site] + bucket = ".output/public" +``` + The module syntax allows you to use [Durable Objects](https://developers.cloudflare.com/workers/learning/using-durable-objects/), [D1](https://developers.cloudflare.com/d1/), and `waitUntil`. You can access the module bindings and context via `event.context.cloudflare`. For example, with the following additions to your `wrangler.toml`: diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index 59cee790c1..d88170be51 100644 --- a/src/presets/cloudflare-module.ts +++ b/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"; @@ -29,6 +30,10 @@ export const cloudflareModule = defineNitroPreset({ resolve(nitro.options.output.dir, "package-lock.json"), JSON.stringify({ lockfileVersion: 1 }, null, 2) ); + const wranglerConfig = await readFile(resolve(nitro.options.rootDir, "wrangler.toml"), "utf8").catch(() => null); + if (wranglerConfig && !wranglerConfig.includes("rules")) { + console.warn('[nitro] You now need to add a "rules" section to your wrangler.toml enabling dynamic imports on the Cloudflare Workers Module preset. Read more at https://nitro.unjs.io/deploy/providers/cloudflare#cloudflare-module-workers.'); + } }, }, }); From 5e1f943a148128593c2cdf26ea3c49dabf67061d Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Wed, 19 Apr 2023 11:45:55 +0100 Subject: [PATCH 4/9] style: fix --- src/presets/cloudflare-module.ts | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index d88170be51..e359ac3060 100644 --- a/src/presets/cloudflare-module.ts +++ b/src/presets/cloudflare-module.ts @@ -1,4 +1,4 @@ -import { readFile } from "node:fs/promises" +import { readFile } from "node:fs/promises"; import { resolve } from "pathe"; import { writeFile } from "../utils"; import { defineNitroPreset } from "../preset"; @@ -30,9 +30,14 @@ export const cloudflareModule = defineNitroPreset({ resolve(nitro.options.output.dir, "package-lock.json"), JSON.stringify({ lockfileVersion: 1 }, null, 2) ); - const wranglerConfig = await readFile(resolve(nitro.options.rootDir, "wrangler.toml"), "utf8").catch(() => null); + const wranglerConfig = await readFile( + resolve(nitro.options.rootDir, "wrangler.toml"), + "utf8" + ).catch(() => null); if (wranglerConfig && !wranglerConfig.includes("rules")) { - console.warn('[nitro] You now need to add a "rules" section to your wrangler.toml enabling dynamic imports on the Cloudflare Workers Module preset. Read more at https://nitro.unjs.io/deploy/providers/cloudflare#cloudflare-module-workers.'); + console.warn( + '[nitro] You now need to add a "rules" section to your wrangler.toml enabling dynamic imports on the Cloudflare Workers Module preset. Read more at https://nitro.unjs.io/deploy/providers/cloudflare#cloudflare-module-workers.' + ); } }, }, From 4e30c9c612420799633a713d1611ebbb8730f664 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Sun, 6 Aug 2023 19:35:17 +0100 Subject: [PATCH 5/9] feat(cloudflare-pages): improve cloudflare-pages adaptor to use dynamic imports (#1531) --- src/presets/cloudflare-pages.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/presets/cloudflare-pages.ts b/src/presets/cloudflare-pages.ts index 0f435c2d32..1feaa4082f 100644 --- a/src/presets/cloudflare-pages.ts +++ b/src/presets/cloudflare-pages.ts @@ -25,7 +25,9 @@ export const cloudflarePages = defineNitroPreset({ }, rollupConfig: { output: { - entryFileNames: "_worker.js", + dir: "dist/_worker.js", + inlineDynamicImports: false, + entryFileNames: "index.js", format: "esm", }, }, From 1a4c8ac9eaf2b291669151175f6078b4f3b9d7d8 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 21 Aug 2023 02:20:40 +0200 Subject: [PATCH 6/9] move behind experimental flag --- docs/content/2.deploy/providers/cloudflare.md | 25 +++++++++++++++++++ playground/nitro.config.ts | 6 ++++- src/presets/cloudflare-module.ts | 9 ++++++- src/presets/cloudflare-pages.ts | 14 ++++++++--- 4 files changed, 49 insertions(+), 5 deletions(-) diff --git a/docs/content/2.deploy/providers/cloudflare.md b/docs/content/2.deploy/providers/cloudflare.md index 2d88eb8e33..05e2579d7f 100644 --- a/docs/content/2.deploy/providers/cloudflare.md +++ b/docs/content/2.deploy/providers/cloudflare.md @@ -311,4 +311,29 @@ NITRO_HELLO_THERE="captain" SECRET="top-secret" ``` +## Experimental Dynamic Imports +By default cloudflare presets output to a single bundle file. + +::alert{type="warning"} +This is an experimental mode and is likely not working at the moment! +:: + +In order to try experimental dynamic imports you need to set the `NITRO_EXP_CLOUDFLARE_DYNAMIC_IMPORTS` environment variable. + +With `cloudflare_module` preset, you need to add the following rule to your `wrangler.toml`: + +```diff + name = "playground" + main = "./.output/server/index.mjs" + workers_dev = true + compatibility_date = "2022-09-10" + account_id = "" + route = "" ++ rules = [ ++ { type = "ESModule", globs = ["**/*.js", "**/*.mjs"]}, ++ ] + + [site] + bucket = ".output/public" +``` diff --git a/playground/nitro.config.ts b/playground/nitro.config.ts index 2a9dd131e6..c1884c6bb2 100644 --- a/playground/nitro.config.ts +++ b/playground/nitro.config.ts @@ -1 +1,5 @@ -export default defineNitroConfig({}); +export default defineNitroConfig({ + cloudflare: { + experimentalDynamicImports: true, + }, +}); diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index 75a3bba646..c939fa6764 100644 --- a/src/presets/cloudflare-module.ts +++ b/src/presets/cloudflare-module.ts @@ -17,10 +17,17 @@ export const cloudflareModule = defineNitroPreset({ output: { format: "esm", exports: "named", - inlineDynamicImports: false, }, }, 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"), diff --git a/src/presets/cloudflare-pages.ts b/src/presets/cloudflare-pages.ts index 75f8a199b5..dae371026c 100644 --- a/src/presets/cloudflare-pages.ts +++ b/src/presets/cloudflare-pages.ts @@ -25,13 +25,21 @@ export const cloudflarePages = defineNitroPreset({ }, rollupConfig: { output: { - dir: "dist/_worker.js", - inlineDynamicImports: false, - entryFileNames: "index.js", + entryFileNames: "_worker.js", format: "esm", }, }, 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); }, From fc7190633578bd9b0ba9c4e6064ff227b319b780 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 21 Aug 2023 02:21:39 +0200 Subject: [PATCH 7/9] remove dup docs --- docs/content/2.deploy/providers/cloudflare.md | 17 ----------------- 1 file changed, 17 deletions(-) diff --git a/docs/content/2.deploy/providers/cloudflare.md b/docs/content/2.deploy/providers/cloudflare.md index 05e2579d7f..3c53a362a7 100644 --- a/docs/content/2.deploy/providers/cloudflare.md +++ b/docs/content/2.deploy/providers/cloudflare.md @@ -183,23 +183,6 @@ wrangler pages deploy **Note:** This preset uses [module syntax](https://developers.cloudflare.com/workers/learning/migrating-to-module-workers/) for deployment. :: -This preset enables dynamic imports by default. You will need to add the following rule to your `wrangler.toml`: - -```diff - name = "playground" - main = "./.output/server/index.mjs" - workers_dev = true - compatibility_date = "2022-09-10" - account_id = "" - route = "" -+ rules = [ -+ { type = "ESModule", globs = ["**/*.js", "**/*.mjs"]}, -+ ] - - [site] - bucket = ".output/public" -``` - The module syntax allows you to use [Durable Objects](https://developers.cloudflare.com/workers/learning/using-durable-objects/), [D1](https://developers.cloudflare.com/d1/), and `waitUntil`. You can access the module bindings and context via `event.context.cloudflare`. For example, with the following additions to your `wrangler.toml`: From d44436fd203ebf5c755c640fcbc1f25ed4824ed7 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 21 Aug 2023 02:25:54 +0200 Subject: [PATCH 8/9] small updates --- docs/content/2.deploy/providers/cloudflare.md | 8 ++++---- playground/nitro.config.ts | 6 +----- src/presets/cloudflare-module.ts | 9 --------- 3 files changed, 5 insertions(+), 18 deletions(-) diff --git a/docs/content/2.deploy/providers/cloudflare.md b/docs/content/2.deploy/providers/cloudflare.md index 3c53a362a7..70d6317af9 100644 --- a/docs/content/2.deploy/providers/cloudflare.md +++ b/docs/content/2.deploy/providers/cloudflare.md @@ -298,15 +298,15 @@ SECRET="top-secret" 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! :: -In order to try experimental dynamic imports you need to set the `NITRO_EXP_CLOUDFLARE_DYNAMIC_IMPORTS` environment variable. - -With `cloudflare_module` preset, you need to add the following rule to your `wrangler.toml`: +With `cloudflare_module` preset, you need to add the following rule to your `wrangler.toml` file: -```diff +```diff [wrangler.toml] name = "playground" main = "./.output/server/index.mjs" workers_dev = true diff --git a/playground/nitro.config.ts b/playground/nitro.config.ts index c1884c6bb2..2a9dd131e6 100644 --- a/playground/nitro.config.ts +++ b/playground/nitro.config.ts @@ -1,5 +1 @@ -export default defineNitroConfig({ - cloudflare: { - experimentalDynamicImports: true, - }, -}); +export default defineNitroConfig({}); diff --git a/src/presets/cloudflare-module.ts b/src/presets/cloudflare-module.ts index c939fa6764..c23887fd8b 100644 --- a/src/presets/cloudflare-module.ts +++ b/src/presets/cloudflare-module.ts @@ -37,15 +37,6 @@ export const cloudflareModule = defineNitroPreset({ resolve(nitro.options.output.dir, "package-lock.json"), JSON.stringify({ lockfileVersion: 1 }, null, 2) ); - const wranglerConfig = await readFile( - resolve(nitro.options.rootDir, "wrangler.toml"), - "utf8" - ).catch(() => null); - if (wranglerConfig && !wranglerConfig.includes("rules")) { - console.warn( - '[nitro] You now need to add a "rules" section to your wrangler.toml enabling dynamic imports on the Cloudflare Workers Module preset. Read more at https://nitro.unjs.io/deploy/providers/cloudflare#cloudflare-module-workers.' - ); - } }, }, }); From 0d98d24103bf709248f8508db738a9e7c8fdd6a6 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 21 Aug 2023 02:26:27 +0200 Subject: [PATCH 9/9] move to advanced sub section --- docs/content/2.deploy/providers/cloudflare.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/content/2.deploy/providers/cloudflare.md b/docs/content/2.deploy/providers/cloudflare.md index 70d6317af9..4efa2e4281 100644 --- a/docs/content/2.deploy/providers/cloudflare.md +++ b/docs/content/2.deploy/providers/cloudflare.md @@ -294,7 +294,9 @@ NITRO_HELLO_THERE="captain" SECRET="top-secret" ``` -## Experimental Dynamic Imports +## Advanced + +### Experimental Dynamic Imports By default cloudflare presets output to a single bundle file.