My react app is blank on gh-pages

I uploaded an app I built with Create-React-App to gh-pagesat https://jerryfireman.github.io/Contacts/.  I have done this previously and it worked fine. But this time all I get is a blank page and the following error messages in the console. 

5jerryfireman.github.io/:1 GET https://jerryfireman.github.io/contacts/static/css/main.b26730bb.chunk.css net::ERR_ABORTED 404 (Not Found)
manifest.json:1 GET https://jerryfireman.github.io/contacts/manifest.json 404 (Not Found)
77Manifest: Line: 1, column: 1, Unexpected token.
76manifest.json:1 GET https://jerryfireman.github.io/contacts/manifest.json 404 (Not Found)

Can anyone tell me what I am doing wrong? Thanks!

2 Likes

Your app is receiving 404 errors because it is requesting files that do not exist. Upon looking at the gh-pages branch on your Contacts repository, it appears that the URLs appear in the format of /contacts/static/js/main.124f9f15.chunk.js (note the lowercase c in contacts). Your repository is named Contacts (note the uppercase first character). In your post, you even use the uppercase C in the URL. When I manually requested the URL [https://jerryfireman.github.io/contacts/static/js/main.124f9f15.chunk.js](https://jerryfireman.github.io/contacts/static/js/main.124f9f15.chunk.js), I get the 404 error. But when I request the URL [https://jerryfireman.github.io/Contacts/static/js/main.124f9f15.chunk.js](https://jerryfireman.github.io/Contacts/static/js/main.124f9f15.chunk.js), I get the expected contents of the file.

If you change the URLs in your application to use the proper casing for the Contacts path, things should work again.

I hope that helps!

5 Likes

Thanks very much lee-dohm! I updated the url and now it is working. I really appreciate your help!

1 Like

For other people who still have this problem, I solved the issue after upgrading ‘gh-pages’ package to the last version.

Also, check if you have this line in package.json: 

"homepage": "*your.gh-page.link.goes.here*/",
2 Likes

I bet that’s the most common mistake for this particular problem…  Nicely done.

Hey, I have this annoying problem for weeks and I can’t solve it. I get a blank page all the time and when I type npm start in my terminal it gives me a bunch of error. I don’t know what’s wrong? I want to learn Vue, angular and react but this problem is always getting in my way.

For all the people who have this problem, if your repository has capital letters, all you have to do is change the name to lowercase only.

1 Like