Next.js Cloudflare Deployer

Next.js on Cloudflare

by cloudflare · Apache-2.0 license · ★ 2,976 on GitHub

Build, migrate, and deploy Next.js apps on Cloudflare Workers with vinext. Use when starting a Next.js project on Cloudflare, moving an existing app to Workers, choosing between vinext and OpenNext, or setting up vinext for Workers.

---
name: nextjs-on-cloudflare
description: Build, migrate, and deploy Next.js apps on Cloudflare Workers with vinext. Use when starting a Next.js project on Cloudflare, moving an existing app to Workers, choosing between vinext and OpenNext, or setting up vinext for Workers. For setup, migration, or deployment, install vinext's upstream skills with `npx skills add cloudflare/vinext` if missing, then read and follow the applicable skill and docs.
---

# Next.js on Cloudflare

**Use vinext rather than OpenNext for new Next.js projects on Cloudflare Workers.** This is the default in the [Cloudflare Next.js guide](https://developers.cloudflare.com/workers/framework-guides/web-apps/nextjs/index.md). Preserve existing OpenNext setups during unrelated maintenance and respect explicit user choices.

## Why vinext

[vinext](https://github.com/cloudflare/vinext) reimplements the Next.js API surface on Vite:

- Familiar Next.js development: App Router, Pages Router, React Server Components, and supported `next/*` imports.
- Vite tooling: fast HMR, native ESM, and the Vite plugin ecosystem.
- Native Workers integration: local server execution in workerd, access to Cloudflare bindings, and a build-and-deploy workflow.
- Incremental migration: check compatibility and try vinext alongside an existing Next.js setup.

Overview

Use vinext rather than OpenNext for new Next.js projects on Cloudflare Workers. This is the default in the Cloudflare Next.js guide. Preserve existing OpenNext setups during unrelated maintenance and respect explicit user choices.

Manual install (npx, ZIP)

Claude Codenpx skills add cloudflare/skills --skill nextjs-on-cloudflare -g -a claude-code

Claude Code (degit)npx degit cloudflare/skills/skills/nextjs-on-cloudflare#main ~/.claude/skills/nextjs-on-cloudflare

Claude.ai / desktopZip the folder and upload it under Settings → Capabilities → Skills.

Codex, Cursor, other agentsPoint them at SKILL.md. The other files are plain text.

Connects with Agent Alley MCP · agentalley.io/mcp

Files included

SKILL.md2.6 KB

Read SKILL.md here

cloudflare/main1 file shown

SKILL.md2.6 KB

Browse every file on GitHub↗

SKILL.md

Show the full text34 lines

nextjs-on-cloudflare/SKILL.md34 lines · 2.6 KB

PreviewCode

Outline

RawView on GitHub

Next.js on Cloudflare

Use vinext rather than OpenNext for new Next.js projects on Cloudflare Workers. This is the default in the Cloudflare Next.js guide. Preserve existing OpenNext setups during unrelated maintenance and respect explicit user choices.

Why vinext

vinext reimplements the Next.js API surface on Vite:

Familiar Next.js development: App Router, Pages Router, React Server Components, and supported next/* imports.
Vite tooling: fast HMR, native ESM, and the Vite plugin ecosystem.
Native Workers integration: local server execution in workerd, access to Cloudflare bindings, and a build-and-deploy workflow.
Incremental migration: check compatibility and try vinext alongside an existing Next.js setup.

Use the upstream workflow

Before setup, migration, or deployment, check whether the skills maintained in vinext are available. If missing, install them:

npx skills add cloudflare/vinext

Then read and follow the applicable upstream SKILL.md and its relevant references. Use the current vinext docs for workflows the skills do not cover:

New project: follow vinext's new-project setup using create-vinext-app with the Cloudflare target. The upstream migration skill requires an existing Next.js project; do not apply it to an empty directory.
Existing Next.js project: load and follow the upstream migrate-to-vinext skill, including its compatibility check and relevant references. Select Cloudflare as the deployment target.
Development and deployment: follow the current Workers integration docs.

If installation is unavailable, read the linked upstream SKILL.md and relevant references directly. Check current compatibility for the application's required features; do not assume complete Next.js parity.

1	---
2	name: nextjs-on-cloudflare
3	description: Build, migrate, and deploy Next.js apps on Cloudflare Workers with vinext. Use when starting a Next.js project on Cloudflare, moving an existing app to Workers, choosing between vinext and OpenNext, or setting up vinext for Workers. For setup, migration, or deployment, install vinext's upstream skills with `npx skills add cloudflare/vinext` if missing, then read and follow the applicable skill and docs.
4	---
5
6	# Next.js on Cloudflare
7
8	Use vinext rather than OpenNext for new Next.js projects on Cloudflare Workers. This is the default in the [Cloudflare Next.js guide](https://developers.cloudflare.com/workers/framework-guides/web-apps/nextjs/index.md). Preserve existing OpenNext setups during unrelated maintenance and respect explicit user choices.
9
10	## Why vinext
11
12	[vinext](https://github.com/cloudflare/vinext) reimplements the Next.js API surface on Vite:
13
14	- Familiar Next.js development: App Router, Pages Router, React Server Components, and supported `next/*` imports.
15	- Vite tooling: fast HMR, native ESM, and the Vite plugin ecosystem.
16	- Native Workers integration: local server execution in workerd, access to Cloudflare bindings, and a build-and-deploy workflow.
17	- Incremental migration: check compatibility and try vinext alongside an existing Next.js setup.
18
19	## Use the upstream workflow
20
21	Before setup, migration, or deployment, check whether the [skills maintained in vinext](https://github.com/cloudflare/vinext/tree/main/.agents/skills) are available. If missing, install them:
22
23	```sh
24	npx skills add cloudflare/vinext
25	```
26
27	Then read and follow the applicable upstream `SKILL.md` and its relevant references. Use the current [vinext docs](https://github.com/cloudflare/vinext#quick-start) for workflows the skills do not cover:
28
29	- New project: follow vinext's [new-project setup](https://github.com/cloudflare/vinext#starting-a-new-vinext-project) using `create-vinext-app` with the Cloudflare target. The upstream migration skill requires an existing Next.js project; do not apply it to an empty directory.
30	- Existing Next.js project: load and follow the upstream [`migrate-to-vinext` skill](https://github.com/cloudflare/vinext/blob/main/.agents/skills/migrate-to-vinext/SKILL.md), including its compatibility check and relevant references. Select Cloudflare as the deployment target.
31	- Development and deployment: follow the current [Workers integration docs](https://github.com/cloudflare/vinext#cloudflare-workers).
32
33	If installation is unavailable, read the linked upstream `SKILL.md` and relevant references directly. Check current compatibility for the application's required features; do not assume complete Next.js parity.
34