How to fix the white screen after build with create-react-app?

Just adding an additional answer, as I know there are many causes for this. I was experiencing a white page following build, and saw a 404 in browser console for web chunks. I'd set 'homepage' in package.json, and was perplexed.

Server side caching

However, I noticed in the 404 message, the chunk being referenced had a different hash than the one in my build folder; these "old" chunks were trying to be fetched, and not the new ones from the latest build with different hashes in the filename.

e.g, the 404 error in my browser console was pointing to a chunk with a hash something like:

main.f1d2d060.chunk.css // from an old build
     ^^^^^^^^^

Where as in /build folder, the chunk was actually:

main.adg25e108.chunk.css // from latest build
     ^^^^^^^^^

Thus I realized some file must be cached trying to retrieve the old thing rather than the new. Turned out I'd had server-side caching enabled, and the old web chunks were trying to be retrieved by a cached version of asset-manifest.json... :sigh: ...I was able to flush the cache for my web host (SiteGround).

Flushing cache will vary depending upon your host: https://www.siteground.com/kb/clear-site-cache/

Something to consider if you've tried everything else -- double and triple check the hash string in the 404 in your console matches that in your /build folder, else you might be in the same situation with an old asset-manifest.json trying to retrieve the wrong stuff.

I also had this problem, blank white screen, no errors. None of these answers solved my problem. I'm gonna leave the solution to my problem here, so that someone else like me wont spent 2 hours on a small mistake.

Just make sure you upload all files in /build folder to the server.

Try changing basename="/" on your BrowserRouter to basename="/React". react-router needs this if used in a sub-directory.

From the react-router docs:

basename: The base URL for all locations. If your app is served from a sub-directory on your server, you'll want to set this to the sub-directory. A properly formatted basename should have a leading slash, but no trailing slash.

Also change homepage in package.json to the url of your production target. homepage="." means it will work on every domain where it is located in the server root (and is also the default behaviour).

From the React docs regarding deployment:

By default, Create React App produces a build assuming your app is hosted at the server root. To override this, specify the homepage in your package.json, for example:

"homepage": "http://mywebsite.com/relativepath",

This will let Create React App correctly infer the root path to use in the generated HTML file.

I ran into the same problem and solved it!

If anyone has still this issue, follow the following steps.

1 - You need to update your browser. Refer to this, https://create-react-app.dev/docs/supported-browsers-features/#configuring-supported-browsers

2- You need to add "react-router-dom": dependency to your package.json file using npm i react-router-dom

3- Add "homepage": ".", to your package.json file

Hope this helps.