Gatsby: [v2] pathPrefix ignored in build from simple starter project

[mmsinclair]

Description

When pathPrefix is set to /foo and the site is built and served statically, the browser renders the page and then immediately redirects to /.

I think it was probably caused by:

https://github.com/gatsbyjs/gatsby/pull/7758
https://github.com/gatsbyjs/gatsby/issues/7454#issuecomment-414425126

Similar issues that might be related are:

https://github.com/gatsbyjs/gatsby/issues/7107
https://github.com/gatsbyjs/gatsby/issues/7289
https://github.com/gatsbyjs/gatsby/issues/7642

I didn't see this happening until I upgraded gatsby and babel. This lock file entry _seems_ to be the problem:

gatsby-react-router-scroll@^2.0.0-rc.2:
  version "2.0.0-rc.2"
  resolved "https://registry.yarnpkg.com/gatsby-react-router-scroll/-/gatsby-react-router-scroll-2.0.0-rc.2.tgz#292f013af77b8a75d3289945c5103a578884dfb3"

Downgrading to 2.0.0-rc.0 appears to fix the issue.

Steps to reproduce

I've made an example project here: https://github.com/mmsinclair/gatsby-site-router-bug

Repro steps are:

• create a new v2 project using the gatsby cli
• add pathPrefix to gatsby-config.js
• build
• copy public to prod-build/foo
• serve locally with npx serve prod-build
• navigate to http://localhost:5000/foo or http://localhost:5000/foo/page-2 and both get redirected to http://localhost:5000

Expected result

It should navigate to http://localhost:5000/foo or http://localhost:5000/foo/page-2.

Actual result

It renders (see curl output) and it redirects to http://localhost:5000/.

Environment

  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.9.0 - ~/.nvm/versions/node/v10.9.0/bin/node
    Yarn: 1.6.0 - /usr/local/bin/yarn
    npm: 6.2.0 - ~/.nvm/versions/node/v10.9.0/bin/npm
  Browsers:
    Chrome: 69.0.3497.81
    Safari: 11.1.2
  npmPackages:
    gatsby: next => 2.0.0-rc.10
    gatsby-plugin-manifest: next => 2.0.2-rc.1
    gatsby-plugin-offline: next => 2.0.0-rc.2
    gatsby-plugin-react-helmet: next => 3.0.0-rc.1

[kakadiadarpan]

Hi @mmsinclair, after updating the following packages, the redirection issue was not reproducible:

• gatsby from 2.0.0-rc.10 to 2.0.0-rc.13
• gatsby-plugin-offline from 2.0.0-rc.2 to 2.0.0-rc.4

However, I faced another issue there after the updates. Prefetching of resources is failing because there is an extra /foo in the URL there:

prefetch.js:24 GET http://localhost:5000/foo/foo/component---src-pages-index-js.305d22058ebeeecba742.css net::ERR_ABORTED 404 (Not Found)
prefetch.js:24 GET http://localhost:5000/foo/foo/static/d/173/path---index-6a9-NZuapzHg3X9TaN1iIixfv1W23E.json net::ERR_ABORTED 404 (Not Found)
prefetch.js:24 GET http://localhost:5000/foo/foo/static/d/53/path---page-2-fbc-5a8-NZuapzHg3X9TaN1iIixfv1W23E.json net::ERR_ABORTED 404 (Not Found)
prefetch.js:24 GET http://localhost:5000/foo/foo/component---src-pages-page-2-js.305d22058ebeeecba742.css net::ERR_ABORTED 404 (Not Found)

Environment info:

  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.9.0 - /usr/local/bin/node
    Yarn: 1.9.4 - /usr/local/bin/yarn
    npm: 6.2.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 69.0.3497.81
    Safari: 11.1.2
  npmPackages:
    gatsby: ^2.0.0-rc.13 => 2.0.0-rc.13
    gatsby-plugin-manifest: next => 2.0.2-rc.1
    gatsby-plugin-offline: ^2.0.0-rc.4 => 2.0.0-rc.4
    gatsby-plugin-react-helmet: next => 3.0.0-rc.1
  npmGlobalPackages:
    gatsby-cli: 2.0.0-rc.1

@pieh any inputs on this?

[pieh]

Original issue was fixed in 2.0.0-rc.11 (with https://github.com/gatsbyjs/gatsby/pull/7871 ).

The follow up issue (one that @kakadiadarpan mention) I think was introduced by https://github.com/gatsbyjs/gatsby/pull/7877 and this https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/cache-dir/prefetch.js#L48 particular line seems to be adding that extra path prefix to the path.

[mmsinclair]

Hi @kakadiadarpan and @pieh, thanks for the quick response. Will try out 2.0.0-rc.13 on the project that is having trouble and get back to you with what happens (shouldn't be any different from the test project).

I haven't added gatsby-plugin-offline yet, but plan to, so it would be great if that was working too :-)

[pieh]

You probably will have problem @kakadiadarpan reported when updating to 2.0.0-rc.13 - it would be great if after updating you try locally commenting out line I linked to above in node_modules/gatsby/cache-dir/prefetch.js in case you run into problem he reported and let us know if that fixes things

[kakadiadarpan]

Hi @pieh, commenting out that line fixes the problem.

[mmsinclair]

Same as @kakadiadarpan for me @pieh - no redirects to the root after render with that commented out

[kakadiadarpan]

@mmsinclair the redirection issue was fixed when you update your packages gatsby and gatsby-plugin-offline to their latest beta versions as I mentioned in the comment above.

Commenting out that line prefetch.js fixes the issue of incorrect URL for resource prefetching.