migrate-to-vinext

Migrate Next.js projects to vinext with Vite config and deployment preparation.

2|Updated Mar 26, 2026
One-click install
npx skills add https://github.com/involvex/happy-vibecode --skill migrate-to-vinext-involvex
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migrate-to-vinext
Source: https://github.com/involvex/happy-vibecode/tree/main/.agents/skills/migrate-to-vinext
Command: npx skills add https://github.com/involvex/happy-vibecode --skill migrate-to-vinext-involvex

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Migrating a Next.js project to a Vite-based runtime can be error-prone and time-consuming due to dependency swaps, ESM conversion, config translation, and deployment differences; this Skill streamlines and automates those tasks to minimize breakage and downtime.

Core Features & Use Cases

  • Compatibility Scanning: Detects next dependency presence, router type (app/ vs pages/), and package manager from lockfiles to produce a scored compatibility report.
  • Automated Migration: Installs vinext and Vite, adds type: module to package.json, renames CJS config files to .cjs, updates scripts, and generates a minimal vite.config.ts.
  • Deployment Preparation: Generates Cloudflare Workers configuration (wrangler.jsonc) or Nitro integration for other platforms and advises on Cloudflare bindings and RSC plugin needs.
  • Use Case: Convert an existing Next.js monorepo to run locally with vinext dev, verify routes and server components, and optionally deploy to Cloudflare Workers with vinext deploy.

Quick Start

Run vinext init to perform an automated migration, then start the development server with vinext dev to verify the project.

Frequently Asked Questions about migrate-to-vinext

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate a Next.js app to Vite?

To migrate a Next.js app to Vite, you can automate the process by scanning for next.config.js, replacing dependencies, converting to ESM, generating vite.config.ts, and preparing deployment configurations. This streamlines dependency swaps and config translation to minimize breakage.

Does vinext work with Next.js app and pages directories?

Yes, vinext works with both Next.js app and pages directories. The migration process detects your router type during compatibility scanning and applies the necessary package replacements and Vite configuration generation for either structure.

How do I convert a Next.js project to ESM for Vite?

To convert a Next.js project to ESM for Vite, the migration adds type: module to package.json and renames CommonJS config files like next.config.js to .cjs. This ensures the Vite-based runtime correctly processes your modules.

Can I deploy a Vite-native Next.js app to Cloudflare Workers?

Yes, you can deploy to Cloudflare Workers. The migration generates a wrangler.jsonc configuration file for Cloudflare deployment and advises on Cloudflare bindings and RSC plugin requirements to ensure your Vite-native app runs correctly on the platform.

What is the best way to automate Next.js to Vite dependency swaps?

The best way to automate Next.js to Vite dependency swaps is using a migration tool that detects your package manager via lockfiles, installs vite and the RSC plugin, and updates your scripts automatically. This minimizes manual errors and downtime.

What are the limitations of migrating Next.js to vinext?

Limitations of migrating Next.js to vinext include potential breakage from ESM conversion and deployment differences. The migration performs compatibility scanning to produce a scored report, but you must verify routes and server components locally with vinext dev before deploying.