Skip to content
Home / Migrations / Create React AppVite

Create React App Vite

easy

CRA is deprecated. Vite is the recommended replacement. Most CRA apps migrate in under 2 hours.

Estimated: 1-2h · 5 steps
Progress0%
Step 1: Install Vite
npm install -D vite @vitejs/plugin-react && npm uninstall react-scripts
Step 2: Create vite.config.ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({ plugins: [react()] })
Step 3: Move index.html

Move public/index.html to root. Replace %PUBLIC_URL% with empty string. Add <script type="module" src="/src/index.tsx">.

Step 4: Replace env vars

REACT_APP_ → VITE_. process.env → import.meta.env.

find src -name '*.ts*' -exec sed -i 's/process.env.REACT_APP_/import.meta.env.VITE_/g' {} +
Step 5: Update scripts

dev: vite, build: vite build, preview: vite preview.

App runs with no errors

What this migration involves

Moving from Create React App to Vite is rated easy and takes about 1-2h on a typical project. The guide breaks it into 5 steps, 3 of which ship with runnable commands and 1 with a verification check.

FAQ

How long does migrating from Create React App to Vite take?

Around 1-2h for a typical project — 5 steps, difficulty rated easy, 3 of them with copy-paste commands.

Is moving from Create React App to Vite reversible?

No reverse guide is tracked yet, so treat this as a one-way move and keep a full export of your Create React App data before you start.

What does Vite cost compared to Create React App?

Vite: open-source from $0/mo, free plan available.