Overview

I use the gatsby environment.

Since graphql is used in gatsby, useStaticQuery is used.

It works fine in the development environment(gatsby develop), In the environment after building(gatsby build && gatsby serve), an error like the title has occurred.

Error Text

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

This is likely a bug in Gatsby and if refreshing the page does not fix it, please open an issue in https://github.com/gatsbyjs/gatsby/issues

Error code

const data = useStaticQuery(
    graphql`
      query {
        allArticle(sort: { order: DESC, fields: updatedAt___seconds }) {
          edges {
            node {
              category
              id
              thumbnail
              title
              createdAt {
                seconds
              }
            }
          }
        }
        allRanking {
          edges {
            node {
              id
              category
              title
              thumbnail
            }
          }
        }
      }
    `
  )

※ Since it worked correctly in secret mode, I wonder if something is wrong with the cache.

What I tried

Delete gatsby

$ yarn remove gatsby
$ rm -rf node_modules
$ yarn install
$ gatsby build && gatsby serve

exec gatsby clean command

$ gatsby clean

change component name and file

https://github.com/gatsbyjs/gatsby/issues/24902#issuecomment-847926225

delete .cache file

my environment

OS : MacOS

package.json

"dependencies": {
    "firebase": "^8.6.7",
    "gatsby": "^3.6.2",
    "gatsby-plugin-advanced-sitemap": "^2.0.0",
    "gatsby-plugin-clarity": "^1.0.0",
    "gatsby-plugin-dark-mode": "^1.1.2",
    "gatsby-plugin-google-adsense": "^1.1.3",
    "gatsby-plugin-google-gtag": "^3.7.1",
    "gatsby-plugin-manifest": "^3.6.0",
    "gatsby-plugin-offline": "^4.6.0",
    "gatsby-plugin-react-helmet": "^4.6.0",
    "gatsby-plugin-twitter": "^3.12.0",
    "gatsby-source-filesystem": "^3.7.1",
    "react": "^17.0.1",
    "react-calendar-heatmap": "^1.8.1",
    "react-copy-to-clipboard": "^5.0.4",
    "react-dom": "^17.0.1",
    "react-helmet": "^6.1.0",
    "react-lazyload": "^3.2.0",
    "react-markdown": "5.0.3",
    "react-scroll": "^1.8.2",
    "react-slick": "^0.28.1",
    "react-syntax-highlighter": "^15.4.3",
    "react-tooltip": "^4.2.21",
    "remark-gfm": "^1.0.0",
    "slick-carousel": "^1.8.1",
    "typescript": "^4.3.2"
  },

CodePudding user response：

It's difficult to guess what's going on, as you pointed it seems related to cache issues, however, you've tried all the cache-related stuff. I'd suggest:

Remove gatsby-plugin-offline and add gatsby-plugin-remove-serviceworker since you won't be using service-workers anymore

Check the importation path. It should be:

import { useStaticQuery } from 'gatsby';

Check the SEO component naming and importation (i.e: Seo.js or SEO.js). The same applies for Layout