GitHub Pages do not publish some files from gh-pages branch

[quincynyan]

Select Topic Area

Bug

Body

Here's my repo, and here's my website.

As you can see, the CSS isn't loading. You can open the console (ctrl+shift+i) and see the 404 errors while fetching the CSS. However, if you go to the gh-pages branch in my repository, the CSS is indeed right there in the folder. Going to the URL of the CSS gives me a 404 error. I have found some workarounds of changing the URL to rawgithubusercontent, but this is a react (nextjs) app and GitHub pages should deploy the website to my custom URL instead of having to fetch from rawgithubusercontent.

I deploy using the pages-build-deployment actions, and it runs successfully. I have found a similar problem described in this question, but it's different because the URL isn't wrong and it's just GitHub pages not loading (cacheing?) these files. I know this because sometimes after waiting 10-20 minutes and force reloading (ctrl+f5) repeatedly, the files do load! So it may be this StackOverflow question was right, I just needed to be patient? Because, again, it only works sometimes where I need to spam the force refresh key after waiting for 10-20 minutes, but most other time, these files won't load at all even after days.

And it's not just that one CSS files, many other JS and SVG files are also not loaded, returning 404 when you go to that URL, but they are right there in the gh-pages branch, and there's nothing wrong with the URL. Because even if there is something wrong in the URL, it shouldn't load in those "sometimes" where I spammed the refresh button for 10 minutes, but they do anyways. So I'm guessing this is some server side error from GitHub Pages.

[airtower-luna]

Going to the URL of the CSS gives me a 404 error.

It's because of the leading underscore in _next. The default Pages build uses Jekyll, and to quote the Jekyll documentation on site structure:

Every file or directory beginning with the following characters: ., _ , # or ~ in the source directory will not be included in the destination folder. Such paths will have to be explicitly specified via the config file in the include directive to make sure they’re copied over:

Any of the following should fix your problem:

• Rename the _next directory so it doesn't start with one of the excluded characters.
• Explicitly tell Jekyll to include _next.
• Disable Jekyll by adding a .nojekyll file to the root of your repository.
• Set up your own build & deploy workflow without Jekyll.

[quincynyan]

Ahh, got it. Thank you!

[quincynyan]

By the way, how do I configure Jekyll? This tutorial doesn't tell me where to find the _config.yml and if I have to create a new one, where would I put it? In the root of gh-pages branch? Or the root of nextjs branch? Or the public folder of nextjs branch so that the file gets deployed to gh-pages?

[airtower-luna]

This tutorial doesn't tell me where to find the _config.yml and if I have to create a new one, where would I put it? In the root of gh-pages branch?

The root of the branch you're deploying from, yes. That's only really useful if you want to use Jekyll to build your website though, otherwise simply disabling it makes more sense.

[quincynyan]

I added a _config.yml but it still isn't working. Am I doing something wrong? It's in the nextjs branch.

[quincynyan]

Oh wait nvm, it works now. I had to use _next instead of _next/ I was using earlier. Thank you very much!