Migrate frontend from Create React App to Vite#567
Open
Conversation
CRA has been unmaintained since 2022 and is no longer recommended by React. This replaces it with Vite 8, which provides faster dev server startup, faster builds, and a smaller dependency footprint (1455 → 169 packages). - Replace react-scripts with vite + @vitejs/plugin-react - Move index.html to project root with module script entry point - Port dev server proxy config from setupProxy.js to vite.config.ts - Rename REACT_APP_API_HOST env var to API_HOST - Remove CRA boilerplate (reportWebVitals, setupTests, react-app-env.d.ts) - Upgrade index.tsx to React 18 createRoot API - Switch plaid-threads imports from default to named exports for Vite CJS interop compatibility - Remove ~ prefix from SCSS imports (webpack convention, not needed by Vite) - Bump tsconfig target to ES2020, Node engine to >= 18 - Update README HTTPS/OAuth instructions for Vite Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
createRootAPI and fixplaid-threadsCJS interop for Vite compatibilityDetails
Build tooling:
react-scripts→vite+@vitejs/plugin-reactsrc/setupProxy.jstovite.config.tsREACT_APP_API_HOSTenv var renamed toAPI_HOSTSource changes:
index.htmlmoved frompublic/to project root (Vite convention)index.tsxupgraded from deprecatedReactDOM.rendertocreateRootplaid-threadsimports changed from default to named exports ({ Button }instead ofButton) for CJS/ESM interop~prefix removed from SCSS@importpaths (webpack convention not needed by Vite)tsconfig.jsontarget bumped to ES2020, Node engine to >= 18Removed CRA boilerplate:
reportWebVitals.ts,setupTests.ts,setupProxy.js,react-app-env.d.tsweb-vitals,sass-loader,react-dev-utilseslintConfig,browserslist,overridesfrompackage.jsonREADME updated with Vite-compatible HTTPS/OAuth instructions and Node >= 18 prerequisite.
Test plan
npm run buildsucceeds (tsc + vite build, ~325ms)npm startserves the app at localhost:3000🤖 Generated with Claude Code
Claude Session: f239487a-6d2b-41a4-8407-5e2a5b43a546