gatsbyjs/gatsby · error

The <StaticQuery /> component is deprecated and will be remo

Error message

The <StaticQuery /> component is deprecated and will be removed in Gatsby v6. Use useStaticQuery instead. Refer to the migration guide for more information: https://gatsby.dev/migrating-4-to-5/#staticquery--is-deprecated

What it means

Error "The <StaticQuery /> component is deprecated and will be removed in Gatsby v6. Use useStaticQuery instead. Refer to the migration guide for more information: https://gatsby.dev/migrating-4-to-5/#staticquery--is-deprecated" thrown in gatsbyjs/gatsby.

Source

Thrown at packages/gatsby/cache-dir/static-query.js:27

    ? data.data
    : staticQueryData[query] && staticQueryData[query].data

  return (
    <React.Fragment>
      {finalData && render(finalData)}
      {!finalData && <div>Loading (StaticQuery)</div>}
    </React.Fragment>
  )
}

let warnedAboutStaticQuery = false

// TODO(v6): Remove completely
const StaticQuery = props => {
  const { data, query, render, children } = props

  if (process.env.NODE_ENV === `development` && !warnedAboutStaticQuery) {
    console.warn(
      `The <StaticQuery /> component is deprecated and will be removed in Gatsby v6. Use useStaticQuery instead. Refer to the migration guide for more information: https://gatsby.dev/migrating-4-to-5/#staticquery--is-deprecated`
    )
    warnedAboutStaticQuery = true
  }

  return (
    <StaticQueryContext.Consumer>
      {staticQueryData => (
        <StaticQueryDataRenderer
          data={data}
          query={query}
          render={render || children}
          staticQueryData={staticQueryData}
        />
      )}
    </StaticQueryContext.Consumer>
  )
}

View on GitHub (pinned to e85d62f177)

Solutions

1. Replace <StaticQuery query={...} render={...}> with const data = useStaticQuery(graphql`...`) in a component
2. For class components or HOCs, wrap a small function component that calls useStaticQuery
3. Follow https://gatsby.dev/migrating-4-to-5/#staticquery--is-deprecated
4. useStaticQuery requires the query to be exported/moved to a page or layout component when called outside the data tree

When it happens

Trigger: Thrown at packages/gatsby/cache-dir/static-query.js:27 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of gatsbyjs/gatsby@e85d62f177 (2026-08-26). Data as JSON: /api/errors/e6c4af9f902bd66e. Report an issue: GitHub.