Gatsby: Why GraphQL returns undefined whereas GraphiQL returns something?

[Steffi3rd]

Summary

I made a query with GraphQL and I want to display results with data but it's undefined.

console.log(data) returns undefined

GraphiQL

Relevant Information

I tried an alternative with StaticQuery and it worked.
I don't know why it doesn't work without StaticQuery

Someone can help please?

Environment

  System:
    OS: macOS 10.14
    CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 8.12.0 - /usr/local/bin/node
    npm: 6.4.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 70.0.3538.77
    Safari: 12.0
  npmPackages:
    gatsby: ^2.0.24 => 2.0.43 
    gatsby-image: ^2.0.15 => 2.0.20 
    gatsby-plugin-lodash: ^3.0.1 => 3.0.2 
    gatsby-plugin-manifest: ^2.0.5 => 2.0.8 
    gatsby-plugin-offline: ^2.0.6 => 2.0.13 
    gatsby-plugin-react-helmet: ^3.0.0 => 3.0.1 
    gatsby-plugin-sharp: ^2.0.7 => 2.0.12 
    gatsby-plugin-sitemap: ^2.0.1 => 2.0.2 
    gatsby-source-prismic: ^2.0.0 => 2.1.0 
    gatsby-transformer-sharp: ^2.1.4 => 2.1.8 
  npmGlobalPackages:
    gatsby-cli: 2.4.5

File contents (if changed)

gatsby-config.js: N/A
package.json: N/A
gatsby-node.js: N/A
gatsby-browser.js: N/A
gatsby-ssr.js: N/A

[cwlsn]

On the querying with GraphQL page, it mentions if you want to query in non-page components, you do need to use <StaticQuery />.

[Steffi3rd]

Okay so that's normal! Thanks !