GitHub deployment from gh-pages not updating

Question

I've deployed a page using gh-pages https://dromerosalem.github.io/project-2/, I use to have a home background image that seems doesn't exist any more so I updated by changing just the image what is online url.

• Local is fine and updating with the new image
• Master branch shows new code for the background
• gh-pages branch shows new code for the background

However, the deployment page 'https://dromerosalem.github.io/project-2/' is not updated with the new background image.

Why the deployment doesn't show my changes if gh-pages branch and master branch shows the code as I changed.

Answer 1

@VonC thank you very much for such a detailed answer. I really appreciate it.

The class .home-body is actually applied you can see it when you inspect it.

What is not applied is the new changes I've done in .home-body

.home-body { height: 100vh; width: auto; background-image: url(https://www.bouygues-es.com/sites/world/files/styles/image_background/public/2019-05/Mars.jpg?itok=upJry_B4); background-size: cover;

Regarding your first point, I'm pretty new with the deployments and I'm still trying to understand why my colleague @IAmNini has a different kind of deployment as we notice as well I have master and gh-pages with HTML css files as you saw but she doesn't more than the bundle. Anyway she is facing the same issue than me with the background image not updating being her the upstream.

Thank you

Answer 2

First, I am not sure why you have HTML/CSS files both in master and gh-pages of github.com/dromerosalem/project-2: you can configure a GitHub Project Page site to get its files from the branch gh-pages (default) or branch master.

No need to maintain both branches: more on that below.

Second, I see in the HTML inspector of https://dromerosalem.github.io/project-2/ that the src/styles/style.scss#.home-body is never applied:

This is never applied:

.home-body {
  height: 100vh;
  width: auto;
  background-image: url(https://www.bouygues-es.com/sites/world/files/styles/image_background/public/2019-05/Mars.jpg?itok=upJry_B4);
  background-size: cover;

That explains the lack of picture: this .home-body class is supposed to be generated by Home.js

<div className="home-body">
  <h1>Welcome to Space!</h1>

The parent project IAmNini/project-2 (which you have forked) has:

• a master branch with a site generation in webpack.config.js
• a gh-pages branch with the result of that generation

Its index.html does call iamnini.github.io/project-2/bundle.js which includes the .home-body class.

As your project is organized (master and gh-pages identical in their content), your style is never called, because master never generated the right files in gh-pages.

Considering the parent project hes more recent commits than your fork, you might consider updating your master branch with the upstream one, and try again.

Answer 3

I have faced this issue recently, and I don't know what causes this. Turning github pages box off and on again solved the problem for me.