vinext — Next.js API on Vite, Deploy Anywhere

Skill by ara.so — Daily 2026 Skills collection.

vinext is a Vite plugin that reimplements the Next.js public API surface (routing, SSR, RSC, next/* imports, CLI) so existing Next.js apps run on Vite instead of the Next.js compiler. It targets ~94% API coverage, supports both Pages Router and App Router, and deploys natively to Cloudflare Workers with optional Nitro support for AWS, Netlify, Vercel, and more.

Installation

New project (migrate from Next.js)

# Automated one-command migration
npx vinext init

This will:

1. Run compatibility check (vinext check)
2. Install vite, @vitejs/plugin-react as devDependencies
3. Install @vitejs/plugin-rsc, react-server-dom-webpack for App Router
4. Add "type": "module" to package.json
5. Rename CJS config files (e.g. postcss.config.js → postcss.config.cjs)
6. Add dev:vinext and build:vinext scripts
7. Generate a minimal vite.config.ts

Migration is non-destructive — Next.js still works alongside vinext.

Manual installation

npm install -D vinext vite @vitejs/plugin-react

# App Router only:
npm install -D @vitejs/plugin-rsc react-server-dom-webpack

Update package.json scripts:

{
  "scripts": {
    "dev": "vinext dev",
    "build": "vinext build",
    "start": "vinext start",
    "deploy": "vinext deploy"
  }
}

Agent Skill (AI-assisted migration)

npx skills add cloudflare/vinext
# Then in your AI tool: "migrate this project to vinext"

CLI Reference

CLI Options

vinext dev -p 3001 -H 0.0.0.0
vinext deploy --preview
vinext deploy --env staging --name my-app
vinext deploy --skip-build --dry-run
vinext deploy --experimental-tpr
vinext init --port 3001 --skip-check --force

Configuration

vinext auto-detects app/ or pages/ directory and loads next.config.js automatically. No vite.config.ts is required for basic usage.

Minimal vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { vinext } from 'vinext/vite'

export default defineConfig({
  plugins: [
    react(),
    vinext(),
  ],
})

App Router vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import rsc from '@vitejs/plugin-rsc'
import { vinext } from 'vinext/vite'

export default defineConfig({
  plugins: [
    react(),
    rsc(),
    vinext(),
  ],
})

Cloudflare Workers with bindings