Search code examples
javascriptreactjsgithub-pages

react app published on github pages shows white screen


I have a React.js app, I built this simple meme generator app trying to learn web development (pretty new to the stuff) and am trying to host it using Github pages. I followed all the steps like installing the gh-pages with node and adding the url to the packages.json and adding the extra 2 lines of code for predeploy and deploy. I have the source for the github pages set to gh-pages. i get no errors when I run the command "npm run deploy" in terminal. But when I click the link I get a white screen. The console gives the error "Loading failed for the with source “https://z0onic.github.io/static/js/2.0b197680.chunk.js”. which is the first js file in the build directory. I searched pretty heavily and found other people who had a similar white screen issue but none of the answers helped. I have triple checked against these answers. Based on the error I'm getting I think its a build error but I don't know how to fix it or figure out exactly what is going wrong.

The github repository is at https://github.com/z0onic/meme-page and the link to the blank page that should be the hosted app is https://z0onic.github.io/meme-page/

when hosting locally through vs code with "npm start" command everything works fine.

Any help is appreciated I hope I'm not overlooking something silly but like I said I'm new to coding and still learning.


Solution

  • set the homepage in package.json to "https://<username>.github.io/<reponame>/" of course substituting things in <>