Uncaught Error: The result of this StaticQuery could not be fetched. #26563
Comments
jack0wsky
added
the
type: bug
gatsbot
bot
added
the
status: triage needed
pieh
added
topic: StaticQuery
and removed
status: triage needed
|
Could you try updating |
pieh
added
the
status: needs reproduction
|
I guess I figured it out. For some reason the problem was in |
|
I just had the exact same error - ONLY ON PRODUCTION! The error did not appear in dev. I then realized that the only place I used a static query (via the useStaticQuery hook) could just as well accept a hardcoded value. After changing that the next update to production did not error any more. Phew! I had updated the project just before. So all gatsby parts were up to date, see here: https://github.com/FNSKtZH/ae2/blob/5673e1d282e67e0c52ffff116e27c41d089e912e/package.json |
|
Facing the same issue. gatsby version 2.24.53 and I do not have gatsby-plugin-offline installed. |
|
@jack0wsky @barbalex @Jaikant could you please create a reproduction for us or share your repository. We haven't been able to reproduce this issue. You can always sent me an email at ward@gatsbyjs.com |
|
I've had a call with a customer and they were using cloudfront CDN. Everything was cached, please make sure you do not cache HTML, page-data folder! See https://www.gatsbyjs.com/docs/caching/ |
|
Being a complete noob in these matters: Does https://vercel.com/docs/edge-network/caching mean that that happened in my case too? |
|
@barbalex I'm not sure, if I believe their source code it should have the correct cache-control: Perhaps it's something else, is it https://gabriel-software.ch? If so can you point me to a commit where it was broken? I could play with vercel and see if I can get to the same issue. (it might be offline plugin) |
|
@wardpeet The repository is open source. Only the data in the postgresql database backing it up is not. I just realized that this is the only one of my projects that I do not deploy via vercel (sorry for the noise!) but rather via the docker-compose.yml in the backend directory that is run in a docker droplet of digitalocean.com. That docker backend uses caddy to serve the html folder. As I never spent any thought on caching and do not understand how that is done by caddy it is possible that it's caching was too aggressive. This may not have been a good idea but at the time I had just tried out building the backend via docker (migrating from more traditional, self configured droplets) and I simply gave this way to do it a shot. And it did work a few weeks before the incident and since. |
|
well what this issue is showing is that we should make people more aware of caching and/or update static-query to contain a timestamp |
|
I just got the same error message running Gatsby in production on Vercel: The latest commit was totally harmless, I just removed a file which was not referenced anywhere. And after doing another change to This is super confusing for someone who is new to Gatsby |
|
I am currently getting this error. Initially I only noticed it after our build server pushed it to our staging environment. It took me forever, but I finally reproduced it locally with the following:
I was able to view the exact error locally, which is causing some of the data to not show on the page. It feels like a dependency issue. |
|
Ok, so building using The site looks great now EXCEPT there is a random "Loading (StaticQuery)" inside a div on the page. This has to be related, but at least it's not breaking anything now. Again, this only happens on the production build. |
|
I am running into this same issue. It happens with nearly every production build that I push to Netlify. I have not been able to reproduce the issue locally, and there are no build errors. On my production site, the only solution I've found is to clear the cache and rebuild after each site update. My current dependencies are: |
|
🤔 I assumed it was caching headers or the platform not purging but it seems like we should add a hash to the file |
|
I too am experiencing this issue and it's definitely not a cache issue for me. I too do not experience this issue locally. I'm setting up a staging environment with no cache, just hosting the files on S3, and I am getting an undefined property error. It's like the query never ran. I empty the S3 bucket manually and redeploy, and the issue is still there. My current dependencies are: |
|
I may have figured out what the issue is. I haven't run into this error for my last few builds now after making this change. When I set up my new Gatsby project, I changed the case of the default components (layout.js and seo.js) to be PascalCase (Layout.js, SEO.js). I know that git by default ignores changes in filename case, so I had to update my git.config to register these changes by running However, it appears that the original lowercase file was never completely removed. It didn't appear in my repository or local branch, but I noticed that when I staged my changes in VSCODE, both the lowercase and uppercase versions of the files were listed! To fully remove the old versions of the files, I had to run: Pushing that change seems to have fixed the Static Query error. |
|
Oh I'll try to use this as a reproduction 👍 Thanks! |
|
any news? I tried all the solutions, none works :/ and I can't update any staticquery on the company website because it breaks EVERYTHING edit: |
|
Same issue as @persocon ☝️
|
Simple Solution
|
|
@AbdulSamadMalik this did not seems to solve the problem for me on windows. |
|
Well these are my dependencies make sure you have same versions as these {
"dependencies": {
"gatsby": "^3.11.1",
"gatsby-plugin-minify-classnames": "^0.3.1",
"gatsby-plugin-react-helmet": "^4.12.0",
"gatsby-plugin-sass": "^4.12.0",
"gatsby-plugin-sitemap": "^4.8.0",
"gatsby-source-filesystem": "^3.12.0",
"gatsby-transformer-json": "^3.12.0",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-helmet": "^6.1.0",
"sass": "^1.38.1"
},
"devDependencies": {
"@types/react-helmet": "^6.1.2",
"prettier": "2.3.2",
"typescript": "^4.3.5"
}
} |
|
This error seems to happen to so many people, for completely different reasons. Isn't it possible to send more information along with this error, so we have the smallest chance to find what's going on?
We've been seeing this error on all the versions of gatsby we've tried, we tried a ton of fixes suggested here and in the dozens of other issues with this error, and nothing ever worked. From v2.20 to today's 3.10 in my history. |
|
We ran into this problem too, and nothing here seemed to fix it. We have decided as a team that we can't trust Our problem also came from the SEO component that we implemented which followed this doc: https://www.gatsbyjs.com/docs/add-seo-component/ We realized there really was no reason to have to use the useStaticQuery hook in the seo component, or any query for that matter. Instead we implemented it so that all the data needed for the helmet rendering is passed in via props. Now the SEO component doesn't care how you get your SEO data, and it's easy to test too. Now you can decide how to query for your SEO data however you want in your consumers. Since we're avoiding static queries, we just added the seo data to our pages query so it's pulled in along with the rest of the page data at build time. Works really well and is a lot simpler than using a query in the SEO component. Sadly, I don't have any answer for why the useStaticQuery hook seems to break infrequently and sometimes |
|
I'm now encountering this issue too.
This issue is happening on dev and prod, with Gatsby 4. Repo with issue at specific commit hash: https://github.com/davwheat/personal-portfolio/tree/0ad42bf72eefb26dfd5432b99f903f8e7060a7c7 The troublesome code is here: https://github.com/davwheat/personal-portfolio/blob/0ad42bf72eefb26dfd5432b99f903f8e7060a7c7/blog/2021/10/04/CoverageResourceBlocksDiagram.tsx#L119-L126 ...which is only referenced within MDX here: https://github.com/davwheat/personal-portfolio/blob/0ad42bf72eefb26dfd5432b99f903f8e7060a7c7/blog/2021/10/04/speed-differences-high-low-frequencies.mdx All I wanted to do was reference an SVG file via its public URL instead of a data URI! 😅 The dev error I see is and What is interesting is that the page data for the broken blog article references those other two static query hashes, but not the 528xxx that is attempting to be imported: // Page data from page-data.json for the failed page "/blog/2021/10/04/speed-differences-high-low-frequencies":
{
"componentChunkName": "component---src-templates-blog-article-blog-page-template-tsx",
"path": "/blog/2021/10/04/speed-differences-high-low-frequencies",
"result": {
// [clipped for readability] ...
"path": "2021/10/04/speed-differences-high-low-frequencies",
"redirect_from": null,
"created_at": "4 October 2021 13:00",
"updated_at": "4 October 2021 13:00",
"archived": false
},
"page": 1
}
},
"staticQueryHashes": [
"3360246512",
"63159454"
]
}I've installed the Webpack plugin that @KyleAMathews suggested in his earlier reply, which didn't reveal any capitalisation issues. My NTFS filesystem is set to case sensitive anyway, and I use GH Actions for building, so that would have normally raised any issues beforehand. |
|
@davwheat, you are trying to use |
|
I find this message pops up sometimes when there is an actual error in the code somewhere, like a double import (in typescript), etc. Sometimes, a gatsby clean takes care of it. It's very unfortunate, since the real problem has nothing to do with the useStaticQuery hook- |
|
https://github.com/jsg2021/gatsby-staticquery-error-repro this is my min reproduction... in gatsby 2 it's fine. Ah, mixing |
|
Hey, I am new to this but I have tried this - |
|
Ran into the "The result of this StaticQuery could not be fetched" error while following along with a tutorial and it took about 30 minutes to figure out the issue. I tried "gatsby clean" and deleting and reinstalling my node_modules directory multiple times with no success. I had extracted my query to a useSiteMetadata hook and initially accidentally capitalized the "D" when I created my "useSiteMetaData.js" file, which caused it to be imported as "../hooks/useSiteMetaData.js" in my Nav component. I had changed the filename to "useSiteMetadata.js" but that import was still using the initial capital "D" casing. I corrected the import path to "../hooks/useSiteMetadata.js" and ran "gatsby clean" and the error disappeared. As an extra note, I also removed the cookies in localhost:8000 - I had tried this a few times before with no effect, but I did it right before fixing the import path casing, so wanted to note that just in case. |
pragmaticpat
added
topic: source-wordpress
LekoArts
removed
topic: source-wordpress
|
This is a long opened issue that isn't actionable anymore as we merged PRs like #33956 in the meantime and thus the overall environment has changed dramatically. If you still encounter this issue on Gatsby 4 and can provide a minimal reproduction, please open a new issue. (Comments on this one will be lost) |
|
Its probably caused by the rss feed query requesting 'html' field: https://www.gatsbyjs.com/plugins/gatsby-plugin-feed/ |
|
It is still happening in Gatsby 4. I don't use I use useStaticQuery. |
|
Just trying to follow along with the tutorial and I'm stuck on this Unhandled Runtime Error. It does not occur on the Gatsby Cloud hosted version, however, it does occur locally. Tried incognito, doesn't work. Tried clean, clearing browser cache, reinstalling packages, scouring the code (most of it is copy pasted from the tutorial), nothing works. It started when I added {mdx.frontmatter__slug}.js in part 6 of the tutorial to generate page templates. Instead I get 'Error in function useStaticQuery in ./.cache/static-query.js:83' I'm really stumped, by the tutorial. Wow. |
and others
Description
I have deployed site through Vercel and I'm facing following error.
Error shows when I click on
Productspage or evenContactpage where isn't static query declared. This error didn't exist while developing. Here'sproducts.jsfile:I added
query Productsbecause I thought it'll help but it didn't.Steps to reproduce
Expected result
website should work in production
Actual result
some problems with static query I guess
System:
OS: macOS 10.15.6
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 12.14.0 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/local/bin/yarn
npm: 6.14.8 - /usr/local/bin/npm
Languages:
Python: 2.7.16 - /usr/bin/python
Browsers:
Chrome: 84.0.4147.125
Firefox: 79.0
Safari: 13.1.2
npmPackages:
gatsby: ^2.17.4 => 2.24.10
gatsby-cli: ^2.12.62 => 2.12.65
gatsby-image: ^2.2.29 => 2.4.13
gatsby-plugin-google-analytics: ^2.0.13 => 2.3.13
gatsby-plugin-layout: ^1.0.11 => 1.3.10
gatsby-plugin-manifest: ^2.2.23 => 2.4.20
gatsby-plugin-offline: ^3.0.16 => 3.2.20
gatsby-plugin-react-helmet: ^3.1.13 => 3.3.10
gatsby-plugin-root-import: ^2.0.5 => 2.0.5
gatsby-plugin-sharp: ^2.2.32 => 2.6.21
gatsby-plugin-styled-components: ^3.3.10 => 3.3.10
gatsby-plugin-transition-link: ^1.20.2 => 1.20.2
gatsby-plugin-web-font-loader: ^1.0.4 => 1.0.4
gatsby-source-filesystem: ^2.1.33 => 2.3.22
gatsby-source-graphql: ^2.6.2 => 2.6.2
gatsby-source-shopify: ^3.2.24 => 3.2.24
gatsby-transformer-sharp: ^2.3.0 => 2.5.11
npmGlobalPackages:
gatsby-cli: 2.12.87
The text was updated successfully, but these errors were encountered: