I use Netlify to host my web projects, and I've been running into a consistent but confusing problem. Every time it happens, I forget the solution and have to rediscover it, so I'm hoping that writing this reminds me, and potentially helps anyone else facing the same issue.
I create a React app, and host it at
projectName.example.com. No problems there! However, then I create a redirect that sends it to
example.com/projectName/. This is because I don't want to buy new domains for each project, and find subdomains a little ugly. However, now when I try to visit
example.com/projectName/, I get a blank screen! More specifically, I get a webpage that is only comprised of the contents of the public/ folder.
The solution to this is adding a line to your package.json file. Specifically, the line
"homepage": ".",. This allows the web browser to locate the bundled files that it wasn't able to find before. Why this happens I don't know! If anyone knows why, please leave it in the comments below.