Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting blank page after react app publish in github

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..

like image 950
Partha Avatar asked Jan 29 '19 18:01

Partha


3 Answers

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

like image 171
varoons Avatar answered Oct 10 '22 12:10

varoons


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

like image 34
mehamasum Avatar answered Oct 10 '22 13:10

mehamasum


go to your package.json file where you can see

"private": true,

Make it false

"private": false,

This is work for me

like image 37
Vivek javiya Avatar answered Oct 10 '22 11:10

Vivek javiya