Gatsby deploy on Github pages is missing files, but locally look good

Question

My site built with gatsby: https://github.com/GiorgioRemindme/giorgio-martini doesnt look fine on the deploy: https://giorgioremindme.github.io/giorgio-martini/

If you see the console, some files are failing with 404s.

Failed to load resource: the server responded with a status of 404 ()

Also, If I go to the route /code by clicking on the menu, it says no gihub pages are hosted there.

Any ideas whats the issue?

Answer 1

I assume you haven't configured the path prefixing (pathPrefix).

In your gatsby-config.js:

module.exports = {
  pathPrefix: "/giorgio-martini",
}

And your scripts in the package.json should look like something like:

{
  "scripts": {
    "deploy": "gatsby build --prefix-paths && gh-pages -d public"
  }
}

For a curated guide, check Gatsby's tutorial about How Gatsby Works with GitHub Pages.

By the way, in your repository, you've uploaded the whole content of the /public folder (autogenerated) but not the source code so there's nothing to check there.

In addition, check the withPrefix helper if you are creating manual paths.