Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Code deployed but showing blank page #161

Open
Mannxxx opened this issue Dec 24, 2023 · 3 comments
Open

Code deployed but showing blank page #161

Mannxxx opened this issue Dec 24, 2023 · 3 comments

Comments

@Mannxxx
Copy link

Mannxxx commented Dec 24, 2023

My site is properly functional on local server. However, it is showing a blank page after it's deployed on github pages. It's been 12 hours since I deployed it. But still it's blank. What do I do?

I edited the source code and run the following commands in order:
yarn add -D gh-pages
yarn add --save-dev @babel/plugin-proposal-private-property-in-object
yarn run build
npm run deploy
npm start

It has successfully build and published on github pages. But still it shows blank page.

image
image

On local server, it's fully functional:

image

But after deploying, it shows blank page. I saw online that it takes a bit time to get live properly, but it's been >12 hours.

image

@ldelavois @soumyajit4419 @mspronesti @shoaibsajid1 @Vac95, if anyone can help me out?

@harshprakash01
Copy link

sudo rm -rf node_modules

then

sudo npm i

@Confley
Copy link

Confley commented Sep 6, 2024

It could be an issue with the dependencies. If there are incompatible dependencies, it might does not necessarily affect the development environment (on your local server), but when you deploy the site, that’s when problems occur and nothing renders.

With npm ls (dependency-name) you can view its information and check if it's incompatible with any other dependencies.

@saad-bhatti
Copy link

I recently deployed my version to GitHub pages. Here is a small guide consisting of the steps I took:

Steps to Deploy a React App to GitHub Pages

  1. Install gh-pages dependency:

    npm install gh-pages --save-dev
  2. Add homepage to the top of your package.json:

    "homepage": "https://<GITHUB-USERNAME>.github.io/<REPO-NAME>"
  3. Update the scripts section in your package.json by adding the following:

    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  4. Commit and push these changes.

  5. Deploy your app:

    npm run deploy

Your React app should now be visible at the link specified in Step 2.

Handling Routing Issues

Just as a side note, I noticed I had routing issues with the single-page application on GitHub Pages, you can refer to this guide to resolve these issues.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants