From 3bff0dd2eaf33417fff75e942d9901d5f812a5e8 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Fri, 27 Dec 2024 11:19:15 +0100 Subject: [PATCH 1/2] update workers Next.js guide to work on `@opennextjs/cloudflare@0.3.x` --- .../frameworks/framework-guides/nextjs.mdx | 24 +++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx b/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx index 73d8fd5bcb6241..279d394dc9c31a 100644 --- a/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx +++ b/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx @@ -70,11 +70,11 @@ import { WranglerConfig } from "~/components"; ```toml -main = ".worker-next/index.mjs" +main = ".open-next/worker.js" name = "my-app" compatibility_date = "2024-09-23" compatibility_flags = ["nodejs_compat"] -assets = { directory = ".worker-next/assets", binding = "ASSETS" } +assets = { directory = ".open-next/assets", binding = "ASSETS" } ``` @@ -90,7 +90,7 @@ As shown above, you must enable the [`nodejs_compat` compatibility flag](/worker Add the following to the scripts field of your `package.json` file: ```json -"build:worker": "cloudflare", +"build:worker": "opennextjs-cloudflare", "dev:worker": "wrangler dev --port 8771", "preview:worker": "npm run build:worker && npm run dev:worker", "deploy:worker": "npm run build:worker && wrangler deploy" @@ -115,8 +115,6 @@ npx wrangler@latest kv namespace create NEXT_CACHE_WORKERS_KV #### Add the KV namespace to your Worker - - ```toml @@ -135,9 +133,21 @@ As shown above, the name of the binding that you configure for the KV namespace You can continue to run `next dev` when developing locally. -In step 3, we also added the `npm run preview:worker`, which allows you to quickly preview your app running locally in the Workers runtime, rather than in Node.js. This allows you to test changes in the same runtime that your app runs in, when deployed to Cloudflare. +### 6. Preview locally your application and create an OpenNext config file + +In step 3, we also added the `npm run preview:worker`, which allows you to quickly preview your app running locally in the Workers runtime, rather than in Node.js. +This allows you to test changes in the same runtime that your app runs in, when deployed to Cloudflare. + +To preview your application in such way run: + +```sh +npm run preview:worker +``` + +This command will build your OpenNext application, also creating, if not already present, an `open-next.configs.ts` file for you. +This if necessary if you want to deploy your application with a GibHub/GitLab integration as presented in the next step. -### 6. Deploy to Cloudflare Workers +### 7. Deploy to Cloudflare Workers Either deploy via the command line: From d0aa567028c19a7f2c46c93c36809e70f32411d6 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Fri, 27 Dec 2024 15:55:43 +0100 Subject: [PATCH 2/2] fixup! update workers Next.js guide to work on `@opennextjs/cloudflare@0.3.x` remove outdated video tutorial --- .../docs/workers/frameworks/framework-guides/nextjs.mdx | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx b/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx index 279d394dc9c31a..535d1f4f6d84c0 100644 --- a/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx +++ b/src/content/docs/workers/frameworks/framework-guides/nextjs.mdx @@ -33,14 +33,6 @@ To create a new Next.js app, pre-configured to run on Cloudflare using [`@openne }} /> -## Video Tutorial - - - ## Existing Next.js apps :::note[Minimum required Wrangler version: 3.78.10.]