Getting blank page after react app publish in github
Solution 1
In your package.json homepage
is not correct, so it is messing up the build.
Change
"homepage": "https:Parthaaaaa.github.io/firstwebapp",
to
"homepage": "https://parthaaaaa.github.io/firstwebapp",
Then try building and deploying again.
Documentation on Building for Relative Paths
Solution 2
You need to add your root path to the basename prop of BrowserRouter
If you are not using BrowserRouter, add the following
import BrowserRouter from 'react-router-dom/BrowserRouter'
ReactDOM.render((
<BrowserRouter basename={process.env.PUBLIC_URL}>
<App />
</BrowserRouter>
), ...)
process.env.PUBLIC_URL is is a part of the node.js library and is a dynamically generated url that changes based on what development mode you are in, whether you are working on your app locally, or on an actual production server like GitHub pages (https://parthaaaaa.github.io/firstwebapp/).
Also update the route to your home/firstwebapp component(if any)
<Route exact path='/firstwebapp' render= ... />} />
to
<Route exact path='/' render= ... />} />
With this change when the route path matches the ‘process.env.PUBLIC_URL’ (reponame + ‘/’) it will render your firstwebapp component
Solution 3
go to your package.json
file where you can see
"private": true,
Make it false
"private": false,
This is work for me
Partha
Updated on July 26, 2022Comments
-
Partha almost 2 years
My steps are: npm run build
Then
"homepage": "https://parthaaaaa.github.io/firstwebapp/",
"predeploy": "npm run build",
"deploy": "gh-pages -d build" in package.json file
Then
npm install --save-dev gh-pages
Then
In Github repository.. I selected "gh pages branch.*
Finally,
npm run deploy
but I'm getting a blank page app runs fine in local host..
Help..
-
mehamasum about 5 yearsIt should work. I have forked your code and corrected homepage url in package.json and managed to deploy successfully.
-
Partha about 5 yearsI am still getting blank page :(.Did you run it in master branch or gh-pages ?
-
mehamasum about 5 yearsI just used your
npm run deploy
command, that's it. Your deployment seems stuck for some weird reason. Can you try deploying again? -
mehamasum about 5 yearsHappy to help, and welcome to Stack Overflow. If this answer or any other one solved your issue, please mark it as accepted and upvote :)
-
cigien almost 3 yearsYou appear to be affiliated with the linked site. When linking to your own site or content (or content that you are affiliated with), you must disclose your affiliation in the answer in order for it not to be considered spam. Having the same text in your username as the URL or mentioning it in your profile is not considered sufficient disclosure under Stack Exchange policy. Also note that even with disclosure, linking to your content too often is a problem. A couple of answers should be the limit.
-
Maximillian Laumeister over 2 yearsReact is not server side code.
-
Nipun Ravisara about 2 yearsThis worked for me.
-
Prakash Reddy Potlapadu about 2 yearsThanks this really worked, but
fetch
is not working now