Deploy CRA to GitHub Pages and Netlify

Let’s say you want to deploy a Create React App (CRA) to GitHub Pages and Netlify.

If your GitHub Page is a project site, then the site will be deployed to a subfolder:


But on Netlify, the site will be deployed to the root:


Initially, I thought I needed to add a redirect or rewrite rule on Netlify.

But it turns out the solution is simpler than expected.

Instead of storing the site URL in package.json "homepage", I was able to store it in the environment variable PUBLIC_URL.

So delete "homepage" from package.json:

-"homepage": "",

And set PUBLIC_URL in .env:


Both steps can be done by running the commands:

sed -i '' '/"homepage"/d' package.json
echo PUBLIC_URL=/project/ >> .env

Now when you build for GitHub Pages, everything should still work as expected.

When you build for Netlify, you’ll need to set the environment variable PUBLIC_URL to "" for it to work.

See textventure/play, which is deployed to GitHub Pages and Netlify.

Please support this site and join our Discord!