GitHub page blank after deploy: Failed to load resource: the server responded with a status of 404

Hi All, 

I tried to build a personal website following a template and the website worked perfectly locally. However, after I deployed it to GitHub Pages, I can only see a blank page. I checked the Javascript console and here is the error message: 

Failed to load resource: the server responded with a status of 404 ()

Does anyone have any clue why “” is repeated twice in loading the resource? Here is my github repository:

And here is the personal webpage that is currently showing blank:

My suspect that the error has something to do with path, but I’m not really sure about how to fix it. Any help would be greatly appreciated! Thank you!

1 Like

Hi @jiayibao,

Thanks for being here! To have your repository show up at, you need to setup GitHub Pages for that repository as well. Ie: your repo should be and its URL  ( ).

I hope this helps!


Thanks! In fact, this problem has been solved by the person who provided me the inital website template. Thanks for the input! 


hey, please help me as I am facing the same problem as yours.


thanks alot you saved my life.

1 Like

Can you please share the solution with us? Even though my name is not getting repeated in the HTTP request link but I feel I am facing a similar issue as you did. :slight_smile:

1 Like

I am also facing same problem, this is my website in react

@meghanar121 can you please suggest solution for this…? even i am facing same problem…

1 Like

@sjPrajwal this was react app i made mistake in package.json file, homepage should have proper address
you can follow steps for deploying react app here:

@andreagriffiths11 GitHub Pages is already configured. But it is showing loading error.

PF the below attachments.
hosted site

@andreagriffiths11 github page configuration.

I resolved that problem, try it: go to index.html in your compiled code, for example in Angular is “dist/index.html” and paste that: if you already have it, then delete and replace that line.

Not sure why, but this worked for me: setting the GitHub Pages source to a different branch and then setting it back to the gh-pages branch (or whatever branch you deployed to).

I am getting the same error in my angular app, can you please provide the step to resolve it ?

application link


This looks like it might be a case sensitivity issue. Your Pages site is hosted from a repository called Demo but your base tag is set to demo with a lowercase d:

<base href="">

Can you try setting this to t he following instead and seeing if it makes a difference?

<base href="">

I also had the same kind of issue.
Instead of I wrote .
I changed it to and it worked.

I had the same issue too. I just started react (newbie on react). Here is how I fixed it.

I went into the index.html file that I uploaded (aside from the fact that github made it so difficult and not user friendly to upload) I simply used the web edit on github and made live changes.
For my case: my page is (Home is my repository)
I’ve noticed that when I compiled my react page, it didnt know Home is part of the file directory for my css and js files. Therefore I had to find all the places where it uses

link href="/static/css/main.a124****.chunk.css" or script src="/static/js/2.22a******.chunk.js
and simply add /Home infront.

link href="/Home/static/css/main.a124****.chunk.css" and script src="/Home/static/js/2.22a******.chunk.js

And where ever your code calls js or css or whatever, you will need to add your repo name infront.

Good luck if you have a huge website. Maybe you should add before uploading


This worked for angular as well just added repo link and added repo name infront of js files

I solved this issue. It was very simple … but I tried more than 3 hours :rofl:
you just do that

link href="./Home/static/css/main.a124****.chunk.css" 

just dot before /