From fe47878a29f4655250b97536e0c1674390b5bd9a Mon Sep 17 00:00:00 2001 From: Ankit Gupta Date: Mon, 20 Apr 2026 12:43:15 -0400 Subject: [PATCH 01/16] Migrate from Create React App to Vite Replace react-scripts 3.4.1 with Vite 6 + @vitejs/plugin-react. This drops the NODE_OPTIONS=--openssl-legacy-provider workaround required for Node 17+ on CRA, and shrinks cold dev start to ~125ms and prod build to ~5s (from ~33s). Changes: - Swap scripts: yarn start -> vite; yarn build -> tsc --noEmit && vite build; yarn preview -> vite preview; drop eject/test. - Replace CRA deps with vite, @vitejs/plugin-react, vite-plugin-svgr, vite-tsconfig-paths. - Add vite.config.ts configuring the React and SVGR plugins, the REACT_APP_ env prefix (keeps .env working as-is, with VITE_ also accepted), port 3000, and build output to build/ (preserving the Netlify publish dir). - Move public/index.html to project root. Replace %PUBLIC_URL%/ with / and add the Vite module entry script. - Remove the CRA eslintConfig stanza in package.json; real config lives in .eslintrc. - Add a direct eslint@^7.32.0 devDep (previously hoisted by CRA), drop the react-app extends that no longer resolves, and remove the deleted serviceWorker.ts path from ignorePatterns. - Delete src/serviceWorker.ts and its import; it was already calling unregister() only, so removal is a no-op at runtime. - Rewrite six process.env.REACT_APP_* reads as import.meta.env. - Change Logo.tsx SVG import to use the vite-plugin-svgr ?react suffix. - Update tsconfig.json: target ES2020, add vite/client and vite-plugin-svgr/client types, exclude *.test.ts/tsx files from the build since there is no test runner anymore. - Delete src/setupTests.ts (orphaned CRA jest setup). Known follow-ups (deliberately out of scope for this PR): - @mapbox/mapbox-gl-geocoder imports the Node events module, which Vite externalizes for the browser. If the geocoder search breaks at runtime, it can be addressed by swapping react-map-gl-geocoder for a direct mapbox-gl-geocoder integration in a later phase. - yarn lint surfaces 55 pre-existing errors across the codebase that were previously masked by CRA's react-app eslint preset. These are unrelated to the build migration and should be addressed in a follow-up. Pre-commit lint-staged only runs against staged files, so new commits are unaffected. --- .eslintrc | 3 +- public/index.html => index.html | 22 +- package.json | 20 +- src/components/config/api.ts | 3 +- src/components/generic/Logo.tsx | 2 +- src/components/map/config.ts | 2 +- src/index.tsx | 16 +- src/serviceWorker.ts | 147 - src/setupTests.ts | 19 - tsconfig.json | 10 +- vite.config.ts | 11 + yarn.lock | 15788 +++++++++--------------------- 12 files changed, 4413 insertions(+), 11630 deletions(-) rename public/index.html => index.html (83%) delete mode 100644 src/serviceWorker.ts delete mode 100644 src/setupTests.ts create mode 100644 vite.config.ts diff --git a/.eslintrc b/.eslintrc index 81b11869..b28aa724 100644 --- a/.eslintrc +++ b/.eslintrc @@ -27,7 +27,6 @@ "extends": [ "airbnb-typescript", "airbnb/hooks", - "react-app", "prettier/react", "plugin:jest/recommended", "plugin:react/recommended", @@ -40,7 +39,7 @@ // last configuration in the extends array. "plugin:prettier/recommended" ], - "ignorePatterns": ["scratch", "src/serviceWorker.ts", "build"], + "ignorePatterns": ["scratch", "build"], "rules": { "array-bracket-newline": [ "error", diff --git a/public/index.html b/index.html similarity index 83% rename from public/index.html rename to index.html index ef88da4c..b1a4f333 100644 --- a/public/index.html +++ b/index.html @@ -17,9 +17,9 @@ - - - + + + @@ -29,7 +29,7 @@ name="description" content="An interactive language diversity map of New York City" /> - + @@ -56,17 +56,8 @@ manifest.json provides metadata used when your web app is installed on a user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ --> - - - + + Languages of New York City @@ -82,6 +73,7 @@
+