Skip to content

Commit ca1da84

Browse files
update workers Next.js guide to work on @opennextjs/[email protected] (#18946)
1 parent 24b5047 commit ca1da84

File tree

1 file changed

+17
-15
lines changed
  • src/content/docs/workers/frameworks/framework-guides

1 file changed

+17
-15
lines changed

src/content/docs/workers/frameworks/framework-guides/nextjs.mdx

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -33,14 +33,6 @@ To create a new Next.js app, pre-configured to run on Cloudflare using [`@openne
3333
}}
3434
/>
3535

36-
## Video Tutorial
37-
38-
<Stream
39-
videoId="0b28fdd5938c4929bd7fdedcd167044d"
40-
videoTitle="Deploy NextJS to Your Workers Application"
41-
thumbnailTimeOrURL="2.5s"
42-
/>
43-
4436
## Existing Next.js apps
4537

4638
:::note[Minimum required Wrangler version: 3.78.10.]
@@ -70,11 +62,11 @@ import { WranglerConfig } from "~/components";
7062
<WranglerConfig>
7163

7264
```toml
73-
main = ".worker-next/index.mjs"
65+
main = ".open-next/worker.js"
7466
name = "my-app"
7567
compatibility_date = "2024-09-23"
7668
compatibility_flags = ["nodejs_compat"]
77-
assets = { directory = ".worker-next/assets", binding = "ASSETS" }
69+
assets = { directory = ".open-next/assets", binding = "ASSETS" }
7870
```
7971

8072
</WranglerConfig>
@@ -90,7 +82,7 @@ As shown above, you must enable the [`nodejs_compat` compatibility flag](/worker
9082
Add the following to the scripts field of your `package.json` file:
9183

9284
```json
93-
"build:worker": "cloudflare",
85+
"build:worker": "opennextjs-cloudflare",
9486
"dev:worker": "wrangler dev --port 8771",
9587
"preview:worker": "npm run build:worker && npm run dev:worker",
9688
"deploy:worker": "npm run build:worker && wrangler deploy"
@@ -115,8 +107,6 @@ npx wrangler@latest kv namespace create NEXT_CACHE_WORKERS_KV
115107

116108
#### Add the KV namespace to your Worker
117109

118-
119-
120110
<WranglerConfig>
121111

122112
```toml
@@ -135,9 +125,21 @@ As shown above, the name of the binding that you configure for the KV namespace
135125

136126
You can continue to run `next dev` when developing locally.
137127

138-
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.
128+
### 6. Preview locally your application and create an OpenNext config file
129+
130+
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.
131+
This allows you to test changes in the same runtime that your app runs in, when deployed to Cloudflare.
132+
133+
To preview your application in such way run:
134+
135+
```sh
136+
npm run preview:worker
137+
```
138+
139+
This command will build your OpenNext application, also creating, if not already present, an `open-next.configs.ts` file for you.
140+
This if necessary if you want to deploy your application with a GibHub/GitLab integration as presented in the next step.
139141

140-
### 6. Deploy to Cloudflare Workers
142+
### 7. Deploy to Cloudflare Workers
141143

142144
Either deploy via the command line:
143145

0 commit comments

Comments
 (0)