Answers.Body: <p>So having spoken to the maker of CraftQL yesterday, my mistake was assuming I needed to use <code>gatsby-source-craftcms</code> as my source plugin. In actual fact, the standard <a href="https://www.gatsbyjs.org/packages/gatsby-source-graphql/" rel="nofollow noreferrer"><code>gatsby-source-graphql</code></a> was much better and more abstract, meaning you don't need to construct giant graphQL queries in the <code>gatsby-config</code>. Also the docs for it are much better explained.</p>
  
  <p>now my <code>gatsby-config.js</code> looks like this: </p>
  
  <pre><code>plugins: [
      {
          resolve: `gatsby-source-graphql`,
          options: {
      typeName: "Craft",
      fieldName: "craft",
      // Url to query from
      url: "http://cms.local/api",
      // HTTP headers
      headers: {
        Authorization: `bearer ACCESSTOKENHERE`,
      }
          },
      },
  </code></pre>
  
  <p>and my query looks like this</p>
  
  <pre><code>{
    craft {
      globals {
        contact {
          address
        }
      }
    }
  }
  </code></pre>
  
  <p>which is much more sane and closer the the normal Twig API</p>
  
  <p>You can view the <a href="https://twitter.com/markhuot/status/1059850263706640385" rel="nofollow noreferrer">Twitter exchange here</a> </p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-11-07T10:06:59.537Z
Answers.LastActivityDate: 2018-11-07T10:06:59.537Z
Answers.UserDisplayName: matthewbeta
Answers.Body: <p>In looking at this, the first thing I notice is that your query has a field called <code>globals</code>, but your error has the singular <code>global</code>.</p>
  
  <p>If you open Gatsby’s GraphiQL instance (<code>http://localhost/8000/___graphql</code> in develop mode), can you see the Craft CMS data in the docs? That might help zero in on the query to use in Gatsby.</p>
  
  <p>Hope that helps!</p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-11-06T16:47:13.723Z
Answers.Text: Hi and thanks for the response. That was a typo. I was trying all sorts to get this working and copy/pasted from the wrong terminal. I updated my question. 
  
  I can see the Craft CMS data for `home` but not `globals`. I've made a reduced test with just 1 template and querying only home and globals and same outcome. I'm doing/not doing something... Oh well. I'll keep plugging away. Thanks again!
Answers.UserDisplayName: matthewbeta
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-11-06T16:00:11.500Z
Answers.LastActivityDate: 2018-11-06T16:00:11.500Z
Answers.UserDisplayName: jlengstorf
Body: <p>I am using Craft in headless mode with the CraftQL plugin. My front end is built using Gatsby JS.</p>
  
  <p>I am able to query entries and output the data to my templates, however Global fields are not available. Here is my code:</p>
  
  <pre><code>// gatsby-config.js
  plugins: [
    {
          resolve: `gatsby-source-craftcms`,
          options: {
              endpoint: `http://cms.local/api`,
              token: `REDACTED`,
              query: `{
                  globals: globals {
                      contact {
                          address
                      }
                  },
                  home: entries(section:[home]) {
                      id
                      title
                      ... on Home {
                          subHeading
                          intro
                          ctaButton {
                              ... on CtaButtonButton {
                                  __typename
                                  text
                                  linkUrl
                              }
                          }
                      }
                  },
  // etc
  </code></pre>
  
  <p>And then in my template:</p>
  
  <pre><code>export const query = graphql`
    query {
      home {
          title
          subHeading
          intro
          ctaButton {
              text
              linkUrl
          }
      }
      globals {
          contact {
              address
          }
      }
    }
  `
  </code></pre>
  
  <p>In my console I get:</p>
  
  <pre><code>error  Cannot query field "globals" on type "Query"
  </code></pre>
  
  <p>If I remove the <code>globals</code> from the query I can successfully build and output <code>data.home.title</code>.</p>
  
  <p>I've tried using the CraftQL browser in the CMS and I can successfully query globals:</p>
  
  <p><a href="https://i.sstatic.net/chjTo.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/chjTo.png" alt="enter image description here"></a> </p>
  
  <p>I'm confident I'm missing something but can find nothing in the docs for <a href="https://github.com/gusnips/gatsby-source-craftcms/blob/master/README.md" rel="nofollow noreferrer">Gatsby-Source-Craft</a> or <a href="https://github.com/markhuot/craftql" rel="nofollow noreferrer">CraftQL</a>. </p>
  
  <p>Anyone have any idea what I'm doing wrong here??</p>
  
Tags: <craft3>
Title: Querying Global fields using CraftQL and Gatsby JS
ThreadText: # Querying Global fields using CraftQL and Gatsby JS
  
  (Asked by: username_0 on 2018-11-06)
  
  I am using Craft in headless mode with the CraftQL plugin. My front end is built using Gatsby JS.
  
  I am able to query entries and output the data to my templates, however Global fields are not available. Here is my code:
  
  ```
  // gatsby-config.js
  plugins: [
    {
          resolve: `gatsby-source-craftcms`,
          options: {
              endpoint: `http://cms.local/api`,
              token: `REDACTED`,
              query: `{
                  globals: globals {
                      contact {
                          address
                      }
                  },
                  home: entries(section:[home]) {
                      id
                      title
                      ... on Home {
                          subHeading
                          intro
                          ctaButton {
                              ... on CtaButtonButton {
                                  __typename
                                  text
                                  linkUrl
                              }
                          }
                      }
                  },
  // etc
  
  ```
  
  And then in my template:
  
  ```
  export const query = graphql`
    query {
      home {
          title
          subHeading
          intro
          ctaButton {
              text
              linkUrl
          }
      }
      globals {
          contact {
              address
          }
      }
    }
  `
  
  ```
  
  In my console I get:
  
  ```
  error  Cannot query field "globals" on type "Query"
  
  ```
  
  If I remove the `globals` from the query I can successfully build and output `data.home.title`.
  
  I've tried using the CraftQL browser in the CMS and I can successfully query globals:
  
  [![enter image description here](https://i.sstatic.net/chjTo.png)](https://i.sstatic.net/chjTo.png)
  
  I'm confident I'm missing something but can find nothing in the docs for [Gatsby-Source-Craft](https://github.com/gusnips/gatsby-source-craftcms/blob/master/README.md) or [CraftQL](https://github.com/markhuot/craftql).
  
  Anyone have any idea what I'm doing wrong here??
  
  **Tags:** craft3
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_0 on 2018-11-07. Score: 1 | Accepted answer
  
  So having spoken to the maker of CraftQL yesterday, my mistake was assuming I needed to use `gatsby-source-craftcms` as my source plugin. In actual fact, the standard [`gatsby-source-graphql`](https://www.gatsbyjs.org/packages/gatsby-source-graphql/) was much better and more abstract, meaning you don't need to construct giant graphQL queries in the `gatsby-config`. Also the docs for it are much better explained.
  
  now my `gatsby-config.js` looks like this:
  
  ```
  plugins: [
      {
          resolve: `gatsby-source-graphql`,
          options: {
      typeName: "Craft",
      fieldName: "craft",
      // Url to query from
      url: "http://cms.local/api",
      // HTTP headers
      headers: {
        Authorization: `bearer ACCESSTOKENHERE`,
      }
          },
      },
  
  ```
  
  and my query looks like this
  
  ```
  {
    craft {
      globals {
        contact {
          address
        }
      }
    }
  }
  
  ```
  
  which is much more sane and closer the the normal Twig API
  
  You can view the [Twitter exchange here](https://twitter.com/markhuot/status/1059850263706640385)
  
  
  ---
  
  ### Answer by username_1 on 2018-11-06. Score: 1
  
  In looking at this, the first thing I notice is that your query has a field called `globals`, but your error has the singular `global`.
  
  If you open Gatsby’s GraphiQL instance (`http://localhost/8000/___graphql` in develop mode), can you see the Craft CMS data in the docs? That might help zero in on the query to use in Gatsby.
  
  Hope that helps!
  
  > **Comments:**
  > **username_0**: Hi and thanks for the response. That was a typo. I was trying all sorts to get this working and copy/pasted from the wrong terminal. I updated my question.   I can see the Craft CMS data for `home` but not `globals`. I've made a reduced test with just 1 template and querying only home and globals and same outcome. I'm doing/not doing something... Oh well. I'll keep plugging away. Thanks again!  
  
  ---
  
  