Error / page resources for / not found. Not rendering React

antoinerousseau commented 4 years ago

Description

I'm having multiple Bugsnag reports from Safari and Mobile Safari (various versions and browsers) of this error in .cache/production-app.js in publicLoader.loadPage:

Capture d'écran 2019-11-19 12 20 44

Steps to reproduce

I don't see this Error in my macOS Safari. Website is https://lebikini.com

Expected result

No error

Actual result

An error

Environment


  System:
    OS: macOS 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 10.15.3 - ~/.nvm/versions/node/v10.15.3/bin/node
    Yarn: 1.19.0 - /usr/local/bin/yarn
    npm: 6.12.0 - ~/.nvm/versions/node/v10.15.3/bin/npm
  Languages:
    Python: 2.7.16 - /usr/local/bin/python
  Browsers:
    Chrome: 78.0.3904.97
    Firefox: 70.0
    Safari: 13.0.3
  npmPackages:
    gatsby: ^2.17.13 => 2.17.13
    gatsby-image: ^2.2.32 => 2.2.32
    gatsby-plugin-google-analytics: ^2.1.26 => 2.1.26
    gatsby-plugin-manifest: ^2.2.27 => 2.2.27
    gatsby-plugin-netlify: ^2.1.24 => 2.1.24
    gatsby-plugin-react-helmet: ^3.1.14 => 3.1.14
    gatsby-plugin-sharp: ^2.2.38 => 2.2.38
    gatsby-plugin-styled-components: ^3.1.12 => 3.1.12
    gatsby-plugin-typescript: ^2.1.17 => 2.1.17
    gatsby-source-filesystem: ^2.1.36 => 2.1.36
    gatsby-transformer-sharp: ^2.3.4 => 2.3.4

github-actions[bot] commented 4 years ago

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open! As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

wardpeet commented 4 years ago

@antoinerousseau would it help if we provide a better stacktrace? Like maybe it was 404 or maybe page-data was invalid. At the moment you don't really see a difference.

What do you think the best way moving forward could be? Did you try it on mobile safari/safari yourself?

antoinerousseau commented 4 years ago

@wardpeet thanks for looking into this. I tried with Safari desktop and I couldn't reproduce. I don't own an iPhone. I'm not sure how to proceed, since it happens only sometimes and randomly, but a better stacktrace can't hurt anyway. Note that it only happened 124 times, with 85% Mobile Safari, 10% Safari and 5% Chrome Mobile iOS. Various versions. Also the URL is not always /. I can give you access to the Bugsnag account if you want.

baba43 commented 4 years ago

I've had the same bug report today. Just to let you know that you're not alone.

github-actions[bot] commented 4 years ago

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open! As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

github-actions[bot] commented 4 years ago

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜

Undistraction commented 4 years ago

Seeing the same thing.

It's reasonably often (we are seeing it daily).
Almost all Mobile Safari or Safari.
Almost always /, but very rarely other pages.
Sentry gives the same stacktrace as Bugsnag with the following breadcrumbs:

burtyish commented 4 years ago

Same here. For a page other than /index.

Device Brand | Huawei Family | DRA-LX5

OS Name | Android Version | 8.1.0

Browser name | Chrome Mobile WebView version | 70.0.3538

SDK Name | sentry.javascript.browser Version | 5.12.1

github-actions[bot] commented 4 years ago

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open! As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

Undistraction commented 4 years ago

Still an issue.

vedantroy commented 4 years ago

I'm also getting this issue. gatsby develop works fine, but gatsby build causes the application to break with "Error: page resources for / not found. Not rendering React." at runtime even though the build itself suceeds.

Could this be caused by the fact that I am using Typescript?

I have tried running gatsby clean

Update/Possible Solution: For me the error was caused because I only had a ".env.development" file and not a ".env.production" file. I don't know why this gave such an ambiguous/confusing error and prevented React from rendering though. I feel like the expected behavior would be the same behavior as what happens when I run gatsby develop. When I run gatsby develop and don't have a .env.development file, React still renders but my app crashes because it is missing the important values.

Kanuny commented 4 years ago

I've got same issue. My app hosted on aws and uses cloudfront. I have a policy to redirect all not-existed urls to 404.html page with status 200. This looks strange, but it's really important for one of our features. So in case I type something like my-test-site.com/some-not-existed-page window.pagePath would be /404.html which is correct, but publicLoader.loadPage somewhy tries to load not a 404.html page content, but /my-test-site.com/some-not-existed-page. In fact it uses window.location.pathname but not window.pagePath

JustFly1984 commented 4 years ago

I got same error message in Sentry today: not found. Not rendering React

DennisOosterling commented 4 years ago

I was encountering this issue as well. For me it was reproducible when using named imports for your own components in the pages/index.js file.

Example import Layout from "../components/Layout"; ✅ import { Layout } from "../components"; 🚫

components/index.js would look like this:

import Layout from "./Layout"

export {
  Layout
};

This was with MacOS catelina & chrome Version 80.0.3987.149. "gatsby": "^2.20.13",

Important to note is that I'm using the expo gatsby variant.

stuntbaboon commented 4 years ago

I also had this issue when running a clean gatsby build and the root cause was a resolution in my package.json for an acorn package vulnerability (see https://snyk.io/vuln/npm:acorn):

"resolutions": {
   "acorn": "^7.1.1"
}

Removing this resolution solved the issue for me.

Output from gatsby info:

  System:
    OS: macOS 10.15.4
    CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.10.0 - /usr/local/bin/node
    Yarn: 1.22.4 - ~/.yarn/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
  Languages:
    Python: 2.7.17 - /usr/local/bin/python
  Browsers:
    Chrome: 81.0.4044.92
    Safari: 13.1
  npmPackages:
    gatsby: 2.20.20 => 2.20.20 
    gatsby-plugin-material-ui: 2.1.6 => 2.1.6 
    gatsby-source-graphql: 2.4.0 => 2.4.0

antoinerousseau commented 4 years ago

Still happens a lot (4,500+ times over the last week):

Capture d'écran 2020-04-15 12 08 53

Stacktrace on Mobile Safari:

.cache/production-app.js:128:12

126  publicLoader.loadPage(browserLoc.pathname).then(page => {
127    if (!page || page.status === PageResourceStatus.Error) {
128      throw new Error(
129        `page resources for ${browserLoc.pathname} not found. Not rendering React`
130      )
131    }

Stacktrace on Chrome Mobile:

/app-ac76ae7860adc4ef4414.js:1:179819

Breadcrumbs:

Time	Type	Error	Infos
4ms before	REQUEST	XMLHttpRequest error	GET /page-data/app-data.json
5ms before	REQUEST	XMLHttpRequest error	GET /page-data/index/page-data.json
6ms before	REQUEST	XMLHttpRequest error	GET /page-data/app-data.json
7ms before	REQUEST	XMLHttpRequest error	GET /page-data/index/page-data.json
10ms before	REQUEST	XMLHttpRequest error	GET /page-data/app-data.json
10ms before	REQUEST	XMLHttpRequest error	GET /page-data/index/page-data.json

Most of them happen on Mobile Safari and Chrome Mobile:

Capture d'écran 2020-04-15 12 15 50

Capture d'écran 2020-04-15 12 16 07

Gatsby version: 2.20.13

akilicarslan commented 4 years ago

Check this solution. https://github.com/gatsbyjs/gatsby/issues/11461#issuecomment-459732145

antoinerousseau commented 4 years ago

I don't use gatsby-plugin-offline so there are no service workers.

JustFly1984 commented 4 years ago

Is there any progress? I'm having an issue, and I have plugin offline, and I can't disable the plugin to test if errors goes off.

Undistraction commented 4 years ago

I don't think this has anything to do with the offline plugin. We are seeing plenty of these errors and have never used it.

thekevinbrown commented 4 years ago

To reproduce:

Go to [example no longer needed, see below], note error in console and non-functional React.
Navigate to the home page with logo in top left.
Navigate back to the original page by clicking "Research" in the header. Page now works and panels are collapsible.

How do I debug this? There are no network requests which 404 or anything, so I don't understand what's happening. Local versions are as follows, but builds happen on Netlify:

  System:
    OS: macOS 10.15.3
    CPU: (4) x64 Intel(R) Core(TM) i5-8210Y CPU @ 1.60GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.16.1 - ~/.nvm/versions/node/v12.16.1/bin/node
    Yarn: 1.22.4 - ~/.yarn/bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v12.16.1/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 81.0.4044.122
    Firefox: 75.0
    Safari: 13.0.5
  npmPackages:
    gatsby: 2.21.1 => 2.21.1
    gatsby-image: 2.4.0 => 2.4.0
    gatsby-plugin-graphql-loader: 1.0.2 => 1.0.2
    gatsby-plugin-module-resolver: 1.0.3 => 1.0.3
    gatsby-plugin-page-creator: 2.3.0 => 2.3.0
    gatsby-plugin-react-helmet: 3.3.0 => 3.3.0
    gatsby-plugin-sharp: 2.6.0 => 2.6.0
    gatsby-plugin-typescript: 2.4.0 => 2.4.0
    gatsby-source-contentful: 2.3.1 => 2.3.1
    gatsby-transformer-remark: 2.8.0 => 2.8.0
    gatsby-transformer-sharp: 2.5.0 => 2.5.0

thekevinbrown commented 4 years ago

In our case we had a page as the default export, then had a named export in the page file as well. As soon as anything referenced the named export from outside of the page file, it got very confused.

Fix was to remove all exports from the pages except the default actual page component export.

Undistraction commented 4 years ago

@thekevinbrown Was the error you were seeing intermittent? Or did it happen every time?

thekevinbrown commented 4 years ago

@Undistraction every time you started or refreshed on the page with the problem. If you started on a different page, or navigated off of the page to a working one, then back, it was fine. So basically initial hydration fails in this case, while if you can get the user onto a different page where hydration works, then the downloading and showing of the broken page works.

Would definitely have been better as a clear build error instead of an obscure runtime error if that's possible.

Undistraction commented 4 years ago

@thekevinbrown so I think your issue is unrelated to this this issue (which is an intermittent error that nobody has been able to reliably reproduce), so I think although you are seeing the same error, the cause is different (and thankfully you've easily fixed it).

pertsenga commented 4 years ago

Encountered this error in our prod site and upgrading to the latest Gatsby version (release just 2 days ago) fixed the bug for Safari

maykelknight commented 4 years ago

Upgraded to the latest Gatsby version. Problem still occures

barbalex commented 4 years ago

I have never experienced this before. Suddenly it happens every time. Only in production 😢 This happened after an update 20 hours ago. We quite regularly update dependencies. So basically the project is down and I have no idea how to get it working again.

I tried reverting updates to what they were 20 hours ago. Did not help. Reverting to 8 days ago did not help either.

Here is the project with newish updates: https://vermehrungch-4utm3ymcd.now.sh/Vermehrung/ And here the last working one from 8 days ago: https://vermehrungch-9l709pu84.now.sh/Vermehrung/

barbalex commented 4 years ago

Reverting gatsby dependencies to what they were 9 Days ago got a new build to work again 😆

Will now try to isolate what gatsby dependency causes it.

barbalex commented 4 years ago

O.k., in our case:

definitely gatsby itself is the cause
versions until 2.20.36 work
v2.21.2 and v2.21.3 have above error (I had tested v2.21.17 earlier, same error)

v2.21.0 has different error:

idb-keyval-iife.min.js:1 Uncaught (in promise) DOMException: Failed to execute 'transaction' on 'IDBDatabase': The database connection is closing.
at https://vermehrungch.gabriel-software.now.sh/idb-keyval-iife.min.js:1:353
at new Promise (<anonymous>)
at https://vermehrungch.gabriel-software.now.sh/idb-keyval-iife.min.js:1:323
at async Object.handle (https://vermehrungch.gabriel-software.now.sh/sw.js:162:21)

barbalex commented 4 years ago

Update: The error still happens in gatsby v2.21.19

wardpeet commented 4 years ago

@barbalex could you share your site with us? If it's private send an email to ward@gatsbyjs.com.

I'm getting this error on your site when I debug it

[].concat(function(e) {
                if (Array.isArray(e)) {
                    for (var t = 0, n = Array(e.length); t < e.length; t++) n[t] = e[t];
                    return n
                }
                return Array.from(e)
            }(Object.keys(it.propTypes)), ["children"]);

Stacktrace:

TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at Module.zJQU (VM54 component---src-pages-vermehrung-js-c3ca1cb1b4686475777d.js:13787)
    at c (webpack-runtime-2b4bd8eda0563b1ea7e6.js:1)

barbalex commented 4 years ago

The site is:

https://vermehrung.ch
https://github.com/barbalex/vermehrung
you can even log in using the password sent in mail

The site is in development. So you can even edit data.

jvelay commented 4 years ago

We got same error messages in Sentry recurrently:

Sentry error

We are using gatsby version "2.21.22".

AokabiC commented 4 years ago

I encountered same issue and fixed by downgrading to v2.20.36, which is mentioned above.

O.k., in our case:

definitely gatsby itself is the cause

versions until 2.20.36 work

v2.21.2 and v2.21.3 have above error (I had tested v2.21.17 earlier, same error)

barbalex commented 4 years ago

I ran into this again in a different project that had version 2.21.12. This is really bad as it occurs only in production. Please prioritize this bug.

benweissmann commented 4 years ago

We are seeing this in production on https://www.voteamerica.com/. It happens primarily on Mobile Safari, but we're also seeing it on Android Chrome, desktop Safari, desktop Chrome, and others. We are currently using Gatsby 2.21.40, but we were also seeing the issue on 2.20.12

lastavenka commented 4 years ago

Got the same issue for the one page that has been deleted recently. https://intergiro.com/legal doesn't show the custom 404 page as it's expected (desktop Chrome, Gatsby 2.20.8). Occurs only in production as well.

bluwy commented 4 years ago

In my case, @Kanuny 's comment indirectly solved my issue. I accidentally redirected the page data JSON to a HTML file when publicLoader.loadPage was trying to fetch it. After fixing the redirects, the page data JSON loads properly and all works as usual.

shide1989 commented 4 years ago

The bug suddenly disappeared again. Looks like it might be linked to cache or something

SoldierCorp commented 4 years ago

The error is still happening in the 2.22.12 version on Firefox and Chrome latest versions too.

Please fix it!

antoinerousseau commented 4 years ago

Please fix it!

@SoldierCorp please read about what Open Source is and maybe try fixing it yourself.

andrzejwp commented 4 years ago

@antoinerousseau it's also about helping each other, where the ones who need help - ask for it, and the ones who know how - offer it. So I think your comment is out of place.

antoinerousseau commented 4 years ago

@andrzejwp yes it's about helping each other, not about posting bossy comments like "please fix it!" with no useful information to actually fix the issue, while notifying 25 people following this issue.

Others have commented with detailed insights about how it affects them, which is needed to make the contributors help them and hopefully fix OSS issues.

SoldierCorp commented 4 years ago

@antoinerousseau There is no more useful information related to this one because there is no more information provided by the issue so it just happens, so I wrote that to avoid repeating the same stuff other people are writing because is the same at the end till the latest version.

Is just to let Gatsby know that more people are still experiencing the problem and hasn't been fixed yet.

Sorry if that is bothering you but I am a regular user that is using the framework and for not having time to fix the issue by myself.

jamesjarvis commented 4 years ago

In my case, this was only occurring when prefixing paths, since I am attempting to use gatsby-plugin-ipfs (Running gatsby build --prefix-paths && gatsby serve would yield a "Error / page resources for / not found. Not rendering React" for every page). However, in my index.jsx page I was not running any page queries, but I did have a component that contained a staticQuery, from the useStaticQuery hook. If I commented out this component and rebuild, then the error would go away. Interestingly enough, if I then uncommented this component and rebuild again (so the site is back in the initial state), then it would run fine, and not encounter the "Error / page resources for / not found. Not rendering React" error, suggesting that the build cache contains something important?

So my (rough) thoughts for why this could occur are:

Issues with the index page containing a static query, but not a page query?
Issues with the order of the build process (since caching can modify the results).
Potentially an issue with run static queries or Generating image thumbnails in the build process, since these are the only steps that seem to be skipped thanks to the cache.

dandv commented 4 years ago

I accidentally redirected the page data JSON to a HTML file

Similar situation here. Essentially, an nginx location directive regex was also matching /page-data/items/page-data.json when it shouldn't have. Adding a ^ at the beginning of the regexp avoided the unintended match.

hamzashahab1610 commented 4 years ago

We are seeing this in production on https://www.voteamerica.com/. It happens primarily on Mobile Safari, but we're also seeing it on Android Chrome, desktop Safari, desktop Chrome, and others. We are currently using Gatsby 2.21.40, but we were also seeing the issue on 2.20.12

Also facing the same issue.

b4stien commented 4 years ago

Hi Gatsby team, hi everyone. Would it be possible to specify the errors returned in loadPage which seems to be the source of the various errors surfaced in this issue?

Ref to the function: https://github.com/gatsbyjs/gatsby/blob/030d927cddbdc64f8d93d409a5ada7442d5e62bf/packages/gatsby/cache-dir/loader.js#L179-L242

It is my understanding that this function tries to load app-data.json, page-data.json and then the JS components themselves, thus being very prone to network issues, server config issues, dev issues, config issues... By specifying the error message it would be easier to fix the underlying problems.

(For reference: the last occurence of this issue on our website was because of a circular import)

barbalex commented 4 years ago

I tried again with v2.23.12. Same result: https://vermehrungch-1j64x2olp.vercel.app/Vermehrung

To us it seems absolutely systematic since every version above 2.20.36. On every of five apps built using gatsby. So we have been blocked from updating since.

Which is starting to become a bit of an issue. For instance we are blocked from using any libs using core-js in v3 (https://github.com/gatsbyjs/gatsby/issues/15601). That issue has now been solved - if we could upgrade.

If there is any way I can help with information/tests/whatever, I gladly would.

gatsbyjs / gatsby