GitHub Community
Github pages wont deploy correctly only populates blank screen #52368
-
Select Topic AreaQuestion BodyHi this is my first time trying to deploy a project to github pages, whenever I do it just shows a blank page. The project works when I do npm run dev but not npm run deploy, |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments 8 replies
-
|
Take a look at the <body> <div id="root"></div> <script src="/App.79369579.js"></script> </body>I assume that the script is supposed to populate the document, but it can't be loaded because there's an incorrect absolute URL (starting with |
Beta Was this translation helpful? Give feedback.
-
|
This was a game changer, so now my page is populating my text but my images and fonts are not showing up. I tried also linking the css the way we connected the html but this did not work? Any suggestions? |
Beta Was this translation helpful? Give feedback.
-
|
If it helps at all when I was running dev my css linked was in my app.js |
Beta Was this translation helpful? Give feedback.
-
|
If they're simply not loaded it sounds like there may be similar path issues. It's probably best if you check the documentation of the framework you use (React, as far as I can see at a glance) on how to either set the base directory for your site, or (preferably) have it generate relative paths. |
Beta Was this translation helpful? Give feedback.
-
Additional information:
|
Beta Was this translation helpful? Give feedback.
-
|
Hey, I have this blank screen issue too, but the website initially works for a few minutes after deployment but then goes to a blank screen after a while. Do you have any idea what this could be? I already have the homepage fix in my package.json file, I changed any Browser Router to HashRouter. I am still stuck though. (React app using Rhouters) |
Beta Was this translation helpful? Give feedback.
-
|
is this behaviours observed only after deployment? Since there are several possibilites, can you please share more information about this. If possiible share a link to your repo. |
Beta Was this translation helpful? Give feedback.
-
|
I met this issue as well. What I do is to change the homepage path. In my case, I first do the following things
I found that I cannot access the website, because the relative paths for accessing those js, css files are wrong, you can try to check it in the "index.html" file. Then what I did is, justchange the "homepage" path, i.e. Finally, it works. |
Beta Was this translation helpful? Give feedback.
-
|
I have done all the solutions that are mentioned above still its not working for me |
Beta Was this translation helpful? Give feedback.
-
|
did you found the solution? |
Beta Was this translation helpful? Give feedback.
-
|
yeah. Found a video on YouTube and followed the steps. https://youtu.be/4G6O0BIoq6M?si=WgqiO914o5k3CYtc |
Beta Was this translation helpful? Give feedback.
Take a look at the
index.htmlon yourgh-pagesbranch. Its body is basically empty:I assume that the script is supposed to populate the document, but it can't be loaded because there's an incorrect absolute URL (starting with
/).App.79369579.jsexists in your repository, but it's deployed tohttps://morganwestcoding.github.io/morgan-west-portfolio/App.79369579.js, nothttps://morganwestcoding.github.io/App.79369579.js(where the<script>tag tells the browser to look). You'll need to either make the URL relative (so it works no matter under which path your site is deployed), or fix the base of the path.