Skip to Content
v1.33.8 · shipped One-screen report · Looks like your app Read the changelog →
Migration guidesCreate React App → Vite

Create React App → Vite

Hours Low risk

The React team deprecated Create React App on February 14, 2025: it has no active maintainers and stays in maintenance mode (React blog ). The same post lists Vite as one of the build tools to move to.

A community codemod handles much of the mechanical work:

npx migrate-to-vite@latest cra

This guide walks the rest.

Mushi Mushi keeps working through this migration. The SDK doesn’t care which bundler ships your app; only the env-var prefix changes (REACT_APP_* → VITE_*).

Prerequisites

  • A working CRA app (react-scripts ≥ 5).
  • A Node version the current Vite supports (check the Vite guide ).
  • Mushi Mushi web SDK or React adapter already installed.

Migration checklist

Migration checklist
13 required steps
  1. Step 01
    Branch off main
  2. Step 02
    Run the codemod
  3. Step 03
    Review the diff carefully
  4. Step 04
    Rename env vars: REACT_APP_* → VITE_*
  5. Step 05
    Move public assets
  6. Step 06
    Verify index.html is at the project root
  7. Step 07
    Update SVG-as-React-component imports
  8. Step 08
    Decide on testing framework
  9. Step 09
    Re-verify Mushi Mushi mounts correctly
  10. Step 10
    Remove CRA dependencies
  11. Step 11
    Update tsconfig.json types
  12. Step 12
    Smoke-test dev + prod builds
  13. Step 13
    Submit a test Mushi Mushi report

Common gotchas

  • process.env. Vite doesn’t inject process.env at build time. The codemod rewrites process.env to import.meta.env; grep for REACT_APP_ to catch names that still need the VITE_ prefix.
  • Absolute imports without aliases. CRA had implicit absolute imports via jsconfig.json / tsconfig.json baseUrl. Vite respects tsconfig.json paths only through a plugin such as vite-tsconfig-paths or a resolve.alias entry; add one yourself.
  • Worker imports. CRA used a webpack-specific Worker loader; Vite uses native ?worker URL imports. The codemod won’t migrate workers for you.
  • @craco/craco users. If you used craco for custom webpack config, port those overrides to vite.config.ts plugins manually.

Rollback

Branched in step 1, so a git checkout main reverts cleanly. If you’ve already merged and found an issue after deploying, revert the merge. CRA still builds; it is deprecated, not removed.

Mushi Mushi compatibility

The Mushi Mushi web SDK and React adapter work the same on CRA and Vite. With Vite, MushiProvider can also read VITE_MUSHI_PROJECT_ID and VITE_MUSHI_API_KEY by itself when you don’t pass config.

References

Last updated on
Native iOS / Android → HybridNext.js Pages → App Router