React App on Github Pages is Blank and Returns Error 404 #22392
-
Hi everyone, I deployed a react app to Github Pages and apparently it was successful, but the site shows only a blank white page. The console says ‘Failed to load resource: the server responded with a status of 404 ()’. Here is my repo: GitHub - toyosicodes/memory-game. The link to the site itself is GitHub - toyosicodes/memory-game. I’d appreciate any help. I can’t figure out what I’m doing wrong. I’ve spent hours reading topics about this issue and applied the recommended solutions, but they haven’t worked in my case. |
Beta Was this translation helpful? Give feedback.
Replies: 10 comments
-
GitHub pages only supports static sites, it does not run |
Beta Was this translation helpful? Give feedback.
-
I’m sorry, I don’t understand this |
Beta Was this translation helpful? Give feedback.
-
GitHub pages only serves files that are committed to the repository, any files that are not committed (ex: node_modules, dist) will not be available on the site and will cause a 404 not found. |
Beta Was this translation helpful? Give feedback.
-
Thanks for the explanation. So how can I fix the problem? Because there has to be a way to commit node_modules, right? |
Beta Was this translation helpful? Give feedback.
-
Upon closer inspection it seems that the issue is caused by the links to your sources. The node_modules isn’t the problem. Take this link for example:
When you deploy the site to GitHub pages it serves it at
The correct link would be:
Any of these changes would correct the url to:
|
Beta Was this translation helpful? Give feedback.
-
I really appreciate you helping me. I have to confess, though, that I have no idea how to make the changes you’re suggesting. If you could guide me on that I’d be really grateful. I forgot to add that I’m a beginner when I originally wrote the topic 😅 |
Beta Was this translation helpful? Give feedback.
-
The
toyosicodes/memory-game/blob/c8b97d93ee3da3507de487be88ad980290a2fac1/public/index.html#L5 After building, the link changes to The |
Beta Was this translation helpful? Give feedback.
-
Hi, Im also facing same error my output pages blank |
Beta Was this translation helpful? Give feedback.
-
For anyone landing here with this problem in their Create React App: You need to add the If you don't do this, the references to your static files ( Documentation: https://create-react-app.dev/docs/deployment/#step-1-add-homepage-to-packagejson |
Beta Was this translation helpful? Give feedback.
-
Hi im facing the same issue. This is my repo |
Beta Was this translation helpful? Give feedback.
GitHub pages only supports static sites, it does not run
npm start