Gatsby: On Production 404 is shown for 1 second before matching client paths

[akucharska]

I configured the gatsby-plugin-create-client-paths plugin like this:
{
resolve: gatsby-plugin-create-client-paths,
options: { prefixes: [/docs/*] },
},

On development everything works fine but after building the site, when I browse a url like /docs/latest/root/kyma
Gatsby shows the 404 page for a split second before it loads proper content.

PS It is basically the same issue as https://github.com/gatsbyjs/gatsby/issues/3420 but I use github pages

[ThePaulMcBride]

Essentially, the same solution provided in the linked solution will work. The only problem is that I don't think Github pages supports rewrites. 🤔

[akucharska]

Is there any other way to handle rewrites on github pages? Maybe I can configure it in gatsby?

[ThePaulMcBride]

As far as I am aware, that's what the prefixes option is doing. The problem is, it happens client side, so the page has to load first before the redirect can happen, which is why you are seeing that flash of a 404 before the redirect kicks in.

[akucharska]

In that case, shouldn't there be some kind of loading indicator instead of "Page not found"? Also the first thing in the network tab is status 404.

You can check it here: https://kyma-project.io/
Go to docs, then go to any left navigation link and finally refresh the page.

[kakadiadarpan]

@akucharska from package.json I can see that you are using beta version of Gatsby. Can you please try updating them to their latest version? That might fix the issue for you

[akucharska]

I updated gatsby and it didn't help.
Edited: Here is my fork: https://github.com/akucharska/website/tree/page-not-found

[akucharska]

@kakadiadarpan "Page not found" issue is still valid. Do you have any idea how to deal with it?

[kakadiadarpan]

@akucharska This issue is related to #5329. We'll be closing this issue in favor of #5329.

Please follow that issue for updates regarding this.

[psworld]

I configured the gatsby-plugin-create-client-paths plugin like this:
{
resolve: gatsby-plugin-create-client-paths,
options: { prefixes: [/docs/*] },
},

On development everything works fine but after building the site, when I browse a url like /docs/latest/root/kyma
Gatsby shows the 404 page for a split second before it loads proper content.

PS It is basically the same issue as #3420 but I use github pages

Hey @akucharska , how did you solve this problem. your website doesn't seem to have that problem right now.

[stephanebruckert]

Follow this depending on what host you use https://stackoverflow.com/a/52770491/1515819
In my case I use netlify and all I had to do is install https://www.gatsbyjs.org/packages/gatsby-plugin-netlify/
And add this to my gatsby-config.js

 plugins: [`gatsby-plugin-netlify`]