Repository navigation
Conversation
<!-- Thank you for sending the PR!
TheGeekyM
marked this pull request as ready for review
November 6, 2026 07:18
This branch has not been deployed
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
This PR adds a new docs page,
docusaurus/docs/migrating-from-create-react-app.md. It links to the official migration guides listed in the React team's Sunsetting Create React App post and has a short table of the Create React App conventions that people usually need to replace when they switch tools. The page is in the "Getting Started" sidebar, and the Getting Started page now links to it. This is a docs-only change.Motivation
Create React App is now officially deprecated (#17003, #17008). The site tells people to move off it, but it doesn't help them do that. Someone with an existing app who opens the docs today finds no list of migration guides, and nothing tells them which parts of their app depend on behavior that
react-scriptsprovides without any config file.That second gap is where migrations tend to break. Several features only work because of conventions handled in
packages/react-scripts:config/env.js(lines 67–87) only puts variables that match/^REACT_APP_/iinto the bundle, plusNODE_ENVandPUBLIC_URL.config/paths.js(lines 20–29) works out the public path fromprocess.env.PUBLIC_URLor thehomepagefield inpackage.json. It also resolvessrc/setupProxy.js(line 75), whichconfig/webpackDevServer.config.js(lines 118–120) loads automatically.config/webpack.config.jsreplaces%PUBLIC_URL%inpublic/index.htmlusingInterpolateHtmlPlugin(lines 640–644). It also sets up@svgr/webpack(line 392), which is what makesimport { ReactComponent } from './logo.svg'work. Its build target comes frombrowserslist(line 200).scripts/start.js(line 111) reads theproxyfield frompackage.json.config/modules.jsturnsbaseUrlinjsconfig.json/tsconfig.jsoninto module paths and aliases so absolute imports fromsrcwork.If an app uses any of these, it can build without errors on a new tool and still behave differently at runtime. Examples: env variables come through as
undefined, asset URLs break, the dev proxy is missing, or SVG imports fail. Listing these conventions in one place gives people a checklist before they start.What changed
docusaurus/docs/migrating-from-create-react-app.md(new)REACT_APP_*,PUBLIC_URL/homepage,%PUBLIC_URL%, theproxyfield,src/setupProxy.js,baseUrl, SVGReactComponentimports andbrowserslist. Each row says briefly what CRA does, names theconfig/*.jsfile responsible where that helps, and links to the existing CRA docs page for that feature.docusaurus/website/sidebars.json: addsmigrating-from-create-react-appas the last item under "Getting Started", after "Updating to New Releases", so it sits next to the other upgrade-related page.docusaurus/docs/getting-started.md: adds a one-line deprecation note above "Quick Start" that links to the new page. That's the first page most visitors see.How it works
The page sends readers to the guides maintained by each target tool rather than writing new migration steps. Those projects know their own tooling best and will keep their guides up to date. This repo is deprecated and unlikely to keep step-by-step instructions for six different tools current. I used the same set of guides as the react.dev announcement so the two sources agree.
The conventions table is the only original content. It describes what CRA does, not how to do it in each tool. I wrote it that way on purpose: every row is something this repo can state with authority, and readers look up the equivalent in their target tool's docs. Each row links to the existing CRA docs page (with anchors, e.g.
deployment.md#building-for-relative-paths,importing-a-component.md#absolute-imports,adding-images-fonts-and-files.md#adding-svgs,proxying-api-requests-in-development.md#configuring-the-proxy-manually), so readers can see exactly what behavior they need to reproduce. All the anchors exist in the current docs.Alternatives I considered:
react-scripts migratecommand that rewrites a CRA app for Vite or Rsbuild. This was the original, larger idea. It would mean shipping and maintaining a codemod in a deprecated package, tracking changes in other tools' config formats, and handling many edge cases (ejected apps, custom webpack overrides, CRACO/rewired setups). It might be worth doing later, but it isn't needed to close the docs gap, so it's out of scope here.REACT_APP_FOO→import.meta.env.VITE_FOO"). That would duplicate the target tools' docs, go stale quickly and add a lot of review work. Linking to their guides avoids all of that.getting-started.md. A separate page keeps Getting Started focused on what it already covers. It also gives the migration content a stable URL that can be linked from elsewhere, such as the deprecation message added on init.Tests
No test files were added. This change is docs only and doesn't touch any code under
packages/.To check it locally:
cd docusaurus/website npm install npm startThen check that:
Running
npm run buildin the same directory will also report broken internal doc links.Compatibility & risk
react-scripts.proxyrow doesn't name a file because the field is read inscripts/start.js, not inconfig/. I left the file out to keep the table focused on the user-facing setting.Checklist