Gatsby: Error: The result of this StaticQuery could not be fetched.

Created on 12 Feb 2020  ·  27Comments  ·  Source: gatsbyjs/gatsby

Description

Trying to run gatsby dev on heroku to use as a custom preview instance. This worked very well in the past.

Gatsby dev fails with Error: The result of this StaticQuery could not be fetched.

This seems to be an issue with recent versions of gatsby (^2.18 or so, can't be exact here), since I have an instance running fine on the same environment which shows [email protected] as the installed version, with npm list gatsby.

Steps to reproduce

  1. gatsby new test-gatsby-site
  2. cd test-gatsby-site
  3. add Procfile with web: gatsby develop -p $PORT -H 0.0.0.0
  4. heroku create test-gatsby-site
  5. heroku config:set NODE_ENV=development
  6. heroku config:set NPM_CONFIG_PRODUCTION=false
  7. commit everything in git
  8. git push heroku master
  9. after deploying, which goes fine, open the ap url (test-gatsby-site.herokuapp.com)

Non-working example

Actual example showing the error running at: https://gatsby-plain-test.herokuapp.com/ (give it a minute for the dyno to spin up first, if the page is taking too long too load - it's just asleep as a free dyno)

Working example

As proof that it can work, I've set up another heroku instance with [email protected] which works just fine https://gatsby-plain-testt.herokuapp.com/
The only thing I did was to downgrade the gatsby and corresponding packages versions (react, react-dom, etc)

Expected result

The index page should render.

Actual result

gatsby-error

console shows 3 sets of this type of error, originating from:

index.js:2177 The above error occurred in the <Layout> component:
    in Layout (at pages/index.js:9)
    in IndexPage (created by HotExportedIndexPage)
    in AppContainer (created by HotExportedIndexPage)
    in HotExportedIndexPage (created by PageRenderer)
    in PageRenderer (at query-result-store.js:86)
    in PageQueryStore (at root.js:51)
    in RouteHandler (at root.js:73)
    in div (created by FocusHandlerImpl)
    in FocusHandlerImpl (created by Context.Consumer)
    in FocusHandler (created by RouterImpl)
    in RouterImpl (created by Context.Consumer)
    in Location (created by Context.Consumer)
    in Router (created by EnsureResources)
    in ScrollContext (at root.js:64)
    in RouteUpdates (at root.js:63)
    in EnsureResources (at root.js:61)
    in LocationHandler (at root.js:119)
    in LocationProvider (created by Context.Consumer)
    in Location (at root.js:118)
    in Root (at root.js:127)
    in StaticQueryStore (at root.js:133)
    in _default (at app.js:67)

index.js:2177 The above error occurred in the <AppContainer> component:
    in AppContainer (created by HotExportedIndexPage)
    in HotExportedIndexPage (created by PageRenderer)
    in PageRenderer (at query-result-store.js:86)
    in PageQueryStore (at root.js:51)
    in RouteHandler (at root.js:73)
    in div (created by FocusHandlerImpl)
    in FocusHandlerImpl (created by Context.Consumer)
    in FocusHandler (created by RouterImpl)
    in RouterImpl (created by Context.Consumer)
    in Location (created by Context.Consumer)
    in Router (created by EnsureResources)
    in ScrollContext (at root.js:64)
    in RouteUpdates (at root.js:63)
    in EnsureResources (at root.js:61)
    in LocationHandler (at root.js:119)
    in LocationProvider (created by Context.Consumer)
    in Location (at root.js:118)
    in Root (at root.js:127)
    in StaticQueryStore (at root.js:133)
    in _default (at app.js:67)



md5-e3ef3873dbeff72f06af2a9685dbf549



The above error occurred in the <LocationProvider> component:
    in LocationProvider (created by Context.Consumer)
    in Location (at root.js:118)
    in Root (at root.js:127)
    in StaticQueryStore (at root.js:133)
    in _default (at app.js:67)



md5-6cbbf0f8055ea1ff1f89b4f865effac9



  System:
    OS: Linux 4.4 Ubuntu 18.04.3 LTS (Bionic Beaver)
    CPU: (8) x64 Intel(R) Xeon(R) CPU E5-2670 v2 @ 2.50GHz
    Shell: 4.4.20 - /bin/bash
  Binaries:
    Node: 12.16.0 - ~/.heroku/node/bin/node
    Yarn: 1.22.0 - ~/.heroku/yarn/bin/yarn
    npm: 6.13.4 - ~/.heroku/node/bin/npm
  Languages:
    Python: 2.7.17 - /usr/bin/python
  npmPackages:
    gatsby: ^2.19.7 => 2.19.7
    gatsby-image: ^2.2.39 => 2.2.39
    gatsby-plugin-react-helmet: ^3.1.21 => 3.1.21
    gatsby-plugin-sharp: ^2.4.3 => 2.4.3
    gatsby-source-filesystem: ^2.1.46 => 2.1.46
    gatsby-transformer-sharp: ^2.3.13 => 2.3.13



md5-22fb168ab34070e8c171a66daa7d00d0



    "react": "^16.12.0",
    "react-dom": "^16.12.0",



md5-ef1aa6763e88987e9e2f6cafa35a8d80



System:
    OS: Linux 4.4 Ubuntu 18.04.3 LTS (Bionic Beaver)
    CPU: (8) x64 Intel(R) Xeon(R) CPU E5-2670 v2 @ 2.50GHz
    Shell: 4.4.20 - /bin/bash
  Binaries:
    Node: 12.16.0 - ~/.heroku/node/bin/node
    npm: 6.13.4 - ~/.heroku/node/bin/npm
  Languages:
    Python: 2.7.17 - /usr/bin/python
  npmPackages:
    gatsby: 2.13.35 => 2.13.35
    gatsby-image: ^2.0.41 => 2.2.40
    gatsby-plugin-react-helmet: ^3.0.12 => 3.1.22
    gatsby-plugin-sharp: ^2.3.2 => 2.4.5
    gatsby-source-filesystem: ^2.1.38 => 2.1.48
    gatsby-transformer-sharp: ^2.3.5 => 2.3.14



md5-22fb168ab34070e8c171a66daa7d00d0



    "react": "^16.8.6",
    "react-dom": "^16.8.6",
needs reproduction StaticQuery
Source
picture ovsw
👍1

Most helpful comment

This is getting a serious issue!

I pushed a commit to GitHub today just doing some changes to readme and nothing else. And my production broke showing a white screen to all users.

It still shows the same error message:

https://i.imgur.com/7tsLRCk.png

But don't know:

  • how this is true just for production and not in deployment?
  • if its true how until my last commit it was working properly and broke after doing simple readme changes?

Also I mentioned about this on yet another closed issue yesterday, #13764 .

I hope this gets some attention.

Edit1: I'm deploying via Vercel.

Edit 2: Live demo link (https://wirescript-n8hi8iya9.vercel.app/).

Check console in dev tools

This is the preview link for the readme update commit I talked about above. But now it works after doing a re-deployment.

picture heytulsiprasad on 22 Aug 2020
👍6 👀1

All 27 comments

Upon further testing, it appears the bug was introduced somewhere in Gatsby 2.18, as 2.17.17 still works fine.

ovsw picture ovsw on 12 Feb 2020

Hey, does this only occur on heroku?

wardpeet picture wardpeet on 12 Feb 2020

@wardpeet that's the only place where I encountered it. I don't know if it's limited to heroku.

ovsw picture ovsw on 12 Feb 2020

I can also confirm this bug 

  System:
    OS: macOS 10.15.3
    CPU: (4) x64 Intel(R) Core(TM) i7-4558U CPU @ 2.80GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.9.1 - /usr/local/bin/node
    Yarn: 1.17.3 - /usr/local/bin/yarn
    npm: 6.12.0 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.116
    Firefox: 67.0.4
    Safari: 13.0.5
  npmPackages:
    gatsby: ^2.19.16 => 2.19.16 
    gatsby-image: ^2.2.40 => 2.2.40 
    gatsby-plugin-compile-es6-packages: ^1.1.0 => 1.2.0 
    gatsby-plugin-eslint: ^2.0.5 => 2.0.8 
    gatsby-plugin-google-tagmanager: ^2.1.25 => 2.1.25 
    gatsby-plugin-hubspot: ^1.3.3 => 1.3.3 
    gatsby-plugin-manifest: ^2.2.41 => 2.2.41 
    gatsby-plugin-offline: ^2.2.0 => 2.2.10 
    gatsby-plugin-page-creator: ^2.1.40 => 2.1.40 
    gatsby-plugin-react-helmet: ^3.1.22 => 3.1.22 
    gatsby-plugin-react-helmet-canonical-urls: ^1.2.0 => 1.4.0 
    gatsby-plugin-robots-txt: ^1.5.0 => 1.5.0 
    gatsby-plugin-sharp: ^2.4.5 => 2.4.5 
    gatsby-plugin-sitemap: ^2.2.27 => 2.2.27 
    gatsby-plugin-styled-components: ^3.1.19 => 3.1.19 
    gatsby-plugin-webpack-bundle-analyser-v2: ^1.1.8 => 1.1.8 
    gatsby-source-datocms: ^2.1.23 => 2.1.23 
    gatsby-source-filesystem: ^2.1.48 => 2.1.48 
    gatsby-transformer-react-docgen: ^5.0.29 => 5.0.29 
    gatsby-transformer-sharp: ^2.3.14 => 2.3.14 
  npmGlobalPackages:
    gatsby-cli: 2.8.19
shansmith01 picture shansmith01 on 20 Feb 2020
👍1

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] picture github-actions[bot] on 15 Mar 2020

not stale?

ovsw picture ovsw on 16 Mar 2020

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] picture github-actions[bot] on 6 Apr 2020

Encountering the same issue.

webriq picture webriq on 10 Apr 2020

I am also encountering the same issue with the latest version of gatsby

My gatsby.config.js

module.exports = {
  siteMetadata: {
    siteName: "name",
    social: {
      twitter: "url",
      github: "url",
    },
  },
}

And in my react component I am doing this:

const data = useStaticQuery(graphql`
    query HeaderQuery {
      site {
        siteMetadata {
          siteName: name
          social {
            twitter
            github
          }
        }
      }
    }
  `);
  console.log(data);
sylvesteraswin picture sylvesteraswin on 14 Apr 2020

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] picture github-actions[bot] on 4 May 2020

I can confirm this is still an issue on Heroku.

Only happens on Heroku. Replacing the hook with <StaticQuery /> component leads to infinite Loading(StaticQuery), so this doesn't seem to make a difference.

Trying to do some more tests and will let you know if I can find out something.

Edit: It's only the StaticQuery inside header (from gatsby-starter-default) which does not work. If that query is removed, site works fine. So, the other static queries which are used in the starter to load an image and metadata for SEO work fine as well. It's only that one query which is not inside the context:
image

I couldn't find out why this happens only with specific queries and only on Heroku.

  System:
    OS: Linux 4.4 Ubuntu 18.04.4 LTS (Bionic Beaver)
    CPU: (8) x64 Intel(R) Xeon(R) CPU E5-2670 v2 @ 2.50GHz
    Shell: 4.4.20 - /bin/bash
  Binaries:
    Node: 12.16.3 - ~/.heroku/node/bin/node
    Yarn: 1.22.4 - ~/.heroku/yarn/bin/yarn
    npm: 6.14.4 - ~/.heroku/node/bin/npm
  Languages:
    Python: 2.7.17 - /usr/bin/python
  npmPackages:
    gatsby: ^2.21.0 => 2.21.0
    gatsby-image: ^2.4.0 => 2.4.0
    gatsby-plugin-manifest: ^2.4.0 => 2.4.0
    gatsby-plugin-offline: ^3.2.0 => 3.2.0
    gatsby-plugin-react-helmet: ^3.3.0 => 3.3.0
    gatsby-plugin-sharp: ^2.6.0 => 2.6.0
    gatsby-source-filesystem: ^2.3.0 => 2.3.0
    gatsby-transformer-sharp: ^2.5.0 => 2.5.0
Pyrax picture Pyrax on 6 May 2020

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] picture github-actions[bot] on 27 May 2020

@Pyrax how did you replace the StaticQuery or did you just completely removed it?

dorelljames picture dorelljames on 27 May 2020

@dorelljames I had to completely remove it.

Pyrax picture Pyrax on 27 May 2020

Thank you. I'm going to give it a try.

On Wed, May 27, 2020, 9:04 PM Björn Clees notifications@github.com wrote:

@dorelljames https://github.com/dorelljames I had to completely remove
it.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/21392#issuecomment-634645452,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/ABRK5PWYXNOJGT7LYYKB4ELRTUFW7ANCNFSM4KTS4JUQ
.

webriq picture webriq on 28 May 2020

I'm also experiencing the same issue, trying to set up a live preview server for CraftCMS.

I tried downgrading to @ovsw's working example, but ended up with different Gatsby errors being thrown instead.

Removing all static queries on the site fixed this for me.

andrewmumblebee picture andrewmumblebee on 28 May 2020

@ovsw Would you please attach a minimal reproduction so that we can take a look at this? Thanks!

danabrit picture danabrit on 3 Jun 2020

Want to confirm that this is happening with me as well, and I did absolutely 0 touches to the basic setup.

Step 1: gatsby new gatsby-site
Step 2: gatsby develop

Gatsby version: "^2.22.15",

alex067 picture alex067 on 6 Jun 2020

Hi!

Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.

Thanks for using Gatsby! 💜

LekoArts picture LekoArts on 24 Jun 2020

I ran

Step 1: gatsby new gatsby-site
Step 2: gatsby develop

I don't have any issues with the latest setup.

$  gatsby info

  System:
    OS: Windows 10 10.0.18363
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
  Binaries:
    Node: 12.16.2 - ~\scoop\apps\nvs\current\nodejs\default\node.EXE
    Yarn: 1.22.4 - ~\scoop\apps\yarn\current\Yarn\bin\yarn.CMD
    npm: 6.14.4 - ~\scoop\apps\yarn\current\global\node_modules\.bin\npm.CMD
  Languages:
    Python: 3.8.2
  Browsers:
    Edge: 44.18362.449.0
  npmPackages:
    gatsby: ^2.23.10 => 2.23.10
    gatsby-image: ^2.4.8 => 2.4.8
    gatsby-plugin-manifest: ^2.4.13 => 2.4.13
    gatsby-plugin-offline: ^3.2.12 => 3.2.12
    gatsby-plugin-react-helmet: ^3.3.5 => 3.3.5
    gatsby-plugin-sharp: ^2.6.13 => 2.6.13
    gatsby-source-filesystem: ^2.3.13 => 2.3.13
    gatsby-transformer-sharp: ^2.5.6 => 2.5.6
wardpeet picture wardpeet on 24 Jun 2020

I am having this issue too, the OP (@ovsw) has detailed the exact steps to reproduce this issue.

LukeTongue picture LukeTongue on 25 Jun 2020

I am also facing the same issue, only difference is when I run gatsby develop its works fine but when I run gatsby build I am getting exactly same error.

$  gatsby info

  System:
    OS: Windows 10 10.0.18363
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
  Binaries:
    Node: 12.16.2 - ~\scoop\apps\nvs\current\nodejs\default\node.EXE
    Yarn: 1.22.4 - ~\scoop\apps\yarn\current\Yarn\bin\yarn.CMD
    npm: 6.14.4 - ~\scoop\apps\yarn\current\global\node_modules\.bin\npm.CMD
  Languages:
    Python: 3.8.2
  Browsers:
    Edge: 44.18362.449.0
  npmPackages:
    gatsby: ^2.23.10 => 2.23.10
    gatsby-image: ^2.4.8 => 2.4.8
    gatsby-plugin-manifest: ^2.4.13 => 2.4.13
    gatsby-plugin-offline: ^3.2.12 => 3.2.12
    gatsby-plugin-react-helmet: ^3.3.5 => 3.3.5
    gatsby-plugin-sharp: ^2.6.13 => 2.6.13
    gatsby-source-filesystem: ^2.3.13 => 2.3.13
    gatsby-transformer-sharp: ^2.5.6 => 2.5.6
kamit-transient picture kamit-transient on 1 Jul 2020

Hi!

I'm going to close this now, as we can't do much to help without a reproduction. If you are able to create a minimal reproduction for this then please do reopen the issue.

Thanks!

freiksenet picture freiksenet on 3 Jul 2020

It should be reproducible by exactly the steps OP has described. Last tested it around 7 days ago and that issue still exists. However, please keep in mind that this issue only appears on Heroku.

Pyrax picture Pyrax on 3 Jul 2020
👍3

Hey there! This is still an issue. It's also worth noting that this approach is specifically recommended in the Gatsby docs on how to run a custom preview instance on Heroku, so I really think this should be looked into.

The following reproduction is a simple Gatsby starter (gatsby-starter-hello-world) with a static query for siteMetadata and a Procfile for Heroku.

Here's the reproduction: https://github.com/woodwoerk/heroku-gatsby-dev-bug-repro.git

@freiksenet @LekoArts could this please be reopened? ❤️

woodwoerk picture woodwoerk on 13 Aug 2020
👍1

This is getting a serious issue!

I pushed a commit to GitHub today just doing some changes to readme and nothing else. And my production broke showing a white screen to all users.

It still shows the same error message:

https://i.imgur.com/7tsLRCk.png

But don't know:

  • how this is true just for production and not in deployment?
  • if its true how until my last commit it was working properly and broke after doing simple readme changes?

Also I mentioned about this on yet another closed issue yesterday, #13764 .

I hope this gets some attention.

Edit1: I'm deploying via Vercel.

Edit 2: Live demo link (https://wirescript-n8hi8iya9.vercel.app/).

Check console in dev tools

This is the preview link for the readme update commit I talked about above. But now it works after doing a re-deployment.

heytulsiprasad picture heytulsiprasad on 22 Aug 2020
👍6 👀1

I am also experiencing this random error only when I try to deploy on Netlify.

Sarah86 picture Sarah86 on 24 Sep 2020
Was this page helpful?
0 / 5 - 0 ratings

Related issues

brandonmp picture brandonmp  ·  3Comments
ghost picture ghost  ·  3Comments
dustinhorton picture dustinhorton  ·  3Comments
3CordGuy picture 3CordGuy  ·  3Comments
KyleAMathews picture KyleAMathews  ·  3Comments