Next.js Cloudflare Ready

Overview

Make a Next.js app deployable on Cloudflare Workers with OpenNext, including config files, scripts, and deployment checks. Use OpenNext rather than @cloudflare/next-on-pages because that package is deprecated and lags current Next.js versions.

Quick Start (Workers via OpenNext)

Confirm the target is Cloudflare Workers and keep the Next.js version compatible with OpenNext. Install the dependencies, create open-next.config.ts and wrangler.toml, add build:cf and deploy:cf scripts, run the build and deploy commands, then bind custom domains in Cloudflare and verify DNS.

Install dependencies

npm install -D @opennextjs/cloudflare wrangler

Use a dev dependency for Wrangler so local dev and CI stay on the same CLI version.

Create open-next.config.ts

import { defineCloudflareConfig } from "@opennextjs/cloudflare/config";

export default defineCloudflareConfig();

Keep this file in the repo so the OpenNext CLI does not prompt in CI and fail non-interactive builds.

Create wrangler.toml

name = "your-worker-name"
compatibility_date = "YYYY-MM-DD"
main = ".open-next/worker.js"
compatibility_flags = ["nodejs_compat"]

[assets]
directory = ".open-next/assets"
binding = "ASSETS"

Set compatibility_date to today or earlier in UTC to avoid future-date deploy failures.

Add scripts to package.json

{
  "scripts": {
    "build:cf": "next build && npx opennextjs-cloudflare build",
    "deploy:cf": "wrangler deploy"
  }
}

Build and deploy

npm run build:cf
npm run deploy:cf

Run the OpenNext build after next build so .open-next/worker.js and .open-next/assets exist before deploying.

Local dev

npx wrangler dev

Notes and decisions

Prefer OpenNext for Workers and avoid @cloudflare/next-on-pages because it is deprecated and only supports older Next.js versions. Keep Vercel and Cloudflare independent by isolating DNS records and deploy commands unless the user requests a migration. Bind both example.com and www.example.com as custom domains on the Worker so traffic reaches the deployment.

Troubleshooting

Missing entry-point to Worker script or to assets directory means the OpenNext output is missing, so ensure wrangler.toml points to .open-next/worker.js and .open-next/assets and rerun npm run build:cf.

Missing required open-next.config.ts means the CLI could not scaffold config in CI, so add open-next.config.ts with defineCloudflareConfig() to make builds non-interactive.

Cannot set compatibility date in the future means Cloudflare rejected the deploy, so set compatibility_date to today or earlier in UTC.

could not determine executable to run for package @opennextjs/cloudflare means the wrong binary name was used, so run npx opennextjs-cloudflare build.

www not loading means the Worker is only bound to the root domain, so add www as a custom domain in Workers or create a proxied CNAME to the root domain.