Gatsby: TypeError: Cannot read property 'hash' of undefined in createStaticQueryJob

[stevanpopo]

Description

When I run the command "gatsby develop" I get the below error:

⠋ run static queries
error UNHANDLED REJECTION
TypeError: Cannot read property 'hash' of undefined
  - index.js:156 createStaticQueryJob
    [gatsby-rebuild]/[gatsby]/dist/query/index.js:156:35

Looking into the file suggested ([gatsby]/dist/query/index.js:156) I seem to trigger an error in the createStaticQueryJob function. I only have one component which uses static queries (the SEO component from https://github.com/gatsbyjs/gatsby-starter-blog), and it looks like this:

/**
 * SEO component that queries for data with
 *  Gatsby's useStaticQuery React hook
 *
 * See: https://www.gatsbyjs.org/docs/use-static-query/
 */

import React from "react"
import PropTypes from "prop-types"
import Helmet from "react-helmet"
import { useStaticQuery, graphql } from "gatsby"

function SEO({ description, lang, meta, title }) {
  const { site } = useStaticQuery(
    graphql`
      query {
        site {
          siteMetadata {
            title
            description
            author
          }
        }
      }
    `
  )

  const metaDescription = description || site.siteMetadata.description

  return (
    <Helmet
      htmlAttributes={{
        lang,
      }}
      title={title}
      titleTemplate={`%s | ${site.siteMetadata.title}`}
      meta={[
        {
          name: `description`,
          content: metaDescription,
        },
        {
          property: `og:title`,
          content: title,
        },
        {
          property: `og:description`,
          content: metaDescription,
        },
        {
          property: `og:type`,
          content: `website`,
        },
        {
          name: `twitter:card`,
          content: `summary`,
        },
        {
          name: `twitter:creator`,
          content: site.siteMetadata.author,
        },
        {
          name: `twitter:title`,
          content: title,
        },
        {
          name: `twitter:description`,
          content: metaDescription,
        },
      ].concat(meta)}
    />
  )
}

SEO.defaultProps = {
  lang: `en`,
  meta: [],
  description: ``,
}

SEO.propTypes = {
  description: PropTypes.string,
  lang: PropTypes.string,
  meta: PropTypes.arrayOf(PropTypes.object),
  title: PropTypes.string.isRequired,
}

export default SEO

Interestingly, if I log the data in the function at build time, I see the below output (CAPS represent the data I'm logging):

QUERYID:  sq--src-components-seo-js
COMP:  {
  name: 'usersStevanpopovicDevelopmentStevanpopovicComGatsbyRebuildSrcComponentsSeoJs2417117884',
  componentPath:
'/Users/stevanpopovic/Development/stevanpopovic.com/gatsby-rebuild/src/components/seo.js',
  id: 'sq--src-components-seo-js',
  query: 'query ' +
    'usersStevanpopovicDevelopmentStevanpopovicComGatsbyRebuildSrcComponentsSeoJs2417117884 ' +
    '{\n  site {\n    siteMetadata {\n      title\n      description\n ' +
    '     author\n    }\n  }\n}\n',
  hash: 2417117884
HASH:  2417117884
ID:  sq--src-components-seo-js
QUERY:  query usersStevanpopovicDevelopmentStevanpopovicComGatsbyRebuildSrcComponentsSeoJs2417117884
{
  site {
    siteMetadata {
      title
      description
      author
    }
  }
}
COMPPATH:  /Users/stevanpopovic/Development/stevanpopovic.com/gatsby-rebuild/src/components/seo.js

QUERYID:  sq--src-components-bio-js
COMP:  undefined

So it seems that the function tries to create a second staticQuery from my Bio component? But my Bio component no longer has a Static Query in it (again, from the copied starter template it had a Static Query which I've since deleted). The Bio component looks like this:

/**
 * Bio component
 */

import React from "react"

function Bio() {
  return (
    <div>
      <p className="tagline">Text for my bio goes here.</p>
      <p>More text for my bio.</p>
    </div>
  )
}

export default Bio

Steps to reproduce

On the move - will add this when I can.

Expected result

I expected the code to build without errors.

Actual result

Full error log:

error UNHANDLED REJECTION


  TypeError: Cannot read property 'hash' of undefined

  - index.js:156 createStaticQueryJob
    [gatsby-rebuild]/[gatsby]/dist/query/index.js:156:35

  - index.js:183 
    [gatsby-rebuild]/[gatsby]/dist/query/index.js:183:45

  - Array.map

  - index.js:183 Object.<anonymous>
    [gatsby-rebuild]/[gatsby]/dist/query/index.js:183:35

  - Generator.next

  - new Promise

  - index.js:187 Object.processStaticQueries
    [gatsby-rebuild]/[gatsby]/dist/query/index.js:187:18

  - develop.js:383 
    [gatsby-rebuild]/[gatsby]/dist/commands/develop.js:383:21

  - Generator.next

Environment

System:
    OS: macOS 10.14.5
    CPU: (4) x64 Intel(R) Core(TM) i5-4250U CPU @ 1.30GHz
    Shell: 5.5.1 - /usr/local/bin/zsh
  Binaries:
    Node: 12.4.0 - ~/.nvm/versions/node/v12.4.0/bin/node
    Yarn: 1.6.0 - /usr/local/bin/yarn
    npm: 6.9.0 - ~/.nvm/versions/node/v12.4.0/bin/npm
  Languages:
    Python: 2.7.6 - /usr/local/bin/python
  Browsers:
    Chrome: 75.0.3770.100
    Safari: 12.1.1
  npmPackages:
    gatsby: ^2.9.4 => 2.9.4
    gatsby-image: ^2.1.4 => 2.1.4
    gatsby-plugin-feed: ^2.2.3 => 2.2.3
    gatsby-plugin-google-analytics: ^2.0.21 => 2.0.21
    gatsby-plugin-manifest: ^2.1.1 => 2.1.1
    gatsby-plugin-offline: ^2.1.3 => 2.1.3
    gatsby-plugin-react-helmet: ^3.0.12 => 3.0.12
    gatsby-plugin-sharp: ^2.1.5 => 2.1.5
    gatsby-plugin-twitter: ^2.1.0 => 2.1.0
    gatsby-plugin-typography: ^2.2.13 => 2.2.13
    gatsby-remark-copy-linked-files: ^2.0.13 => 2.0.13
    gatsby-remark-footnotes: ^0.0.5 => 0.0.5
    gatsby-remark-images: ^3.0.16 => 3.0.16
    gatsby-remark-prismjs: ^3.2.11 => 3.2.11
    gatsby-remark-responsive-iframe: ^2.1.1 => 2.1.1
    gatsby-remark-smartypants: ^2.0.9 => 2.0.9
    gatsby-source-filesystem: ^2.0.39 => 2.0.39
    gatsby-transformer-remark: ^2.4.0 => 2.4.0
    gatsby-transformer-sharp: ^2.1.21 => 2.1.21
  npmGlobalPackages:
    gatsby-cli: 2.7.0

[freiksenet]

Hello @stevanpopo!

Sorry to hear you are running into an issue!

This is very odd. I have a feeling it might be related to how static queries are cached, it could be that if component loses the static query, then the cache for that still exists. I wonder if you could try if deleting .cache problem would solve this. Otherwise, I wonder if you could make a minimal reproduction for us.

Thanks a lot! :purple_heart: :muscle:

[stevanpopo]

Ah, you're right. I ran gatsby clean in the cli to clear cache and now it's working. Thanks for that.