Menu
When testing locally my create-react-quiz app works perfectly. I was basing my project off of this code: https://github.com/mitchgavan/react-multi-choice-quiz/tree/gh-pages.
However, when I use npm build deploy on my "GitHub-Pages" branch, a blank page shows up and these errors show up in the console: pk8189.github.io/:1 GET pk8189.github.io/pk8189/futureU-/static/css/main.1dc4d41f.css pk8189.github.io/:1 GET pk8189.github.io/pk8189/futureU-/static/js/main.28e294a0.js
This is my repo: https://github.com/pk8189/futureU- What do you think the issue is? Thank you for any help.
776
Wrapping up The next time you get a white screen after deploying a React app, remember the steps you've learned today: Check the browser's console for errors. Check your javascript bundle files are loading properly. Update the “homepage” setting in your package.
The simplicity of deploying a static website with GitHub Pages is a process that can be easily transferred to React applications. With just a few steps, it's easy to host a React app on GitHub Pages for free or build it to deploy on your own custom domain or subdomain.
The reason why you see your README.md file being rendered instead of your app is because you have not generated the browser-friendly static assets (HTML, CSS, and JavaScript) needed for your app to run in the browser. Luckily, Create-React-App offers a built-in solution to help you bundle your assets with one command.
Create React App uses homepage field in your package.json to determine the URL at which the app is served. Since you set it to https://github.com/pk8189/futureU-/, it tries to request assets from /pk8189/futureU-/ which doesn't exist.
Change homepage to match your deployed URL: https://pk8189.github.io/futureU-/. Then rebuild by running npm run build and re-deploy.
This is described in deployment instructions for GitHub Pages. Please read this part of the User Guide.
100
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
