Does Gatsby GraphQL Need Surrounding Parentheses?

user_6292679 0
Viewed 102

I'm new to Gatsby, especially the interesting syntax choices (only use template literals for strings, don't include ending semicolons).

My question is: do you need parentheses surrounding graphql queries? The documentation doesn't really explain the syntax around using graphql, and the tutorials have queries with and without surrounding parentheses.

Gatsby tutorial - uses surrounding parentheses

exports.createPages = async ({ graphql, actions }) => {
  ...
  const result = await graphql(`     <--- parentheses here
    query {
      allMarkdownRemark {
        edges {
          node {
            fields {
              slug
            }
          }
        }
      }
    }
  `)
  console.log(JSON.stringify(result, null, 4))
}

Gatsby tutorial - no surrounding parentheses

export const query = graphql`     <--- no parentheses here
  query {
    site {
      siteMetadata {
        title
      }
    }
  }
`

Is it because of the await on the first example, or am I not understanding something else? Thank you in advance!

graphql-js gatsby
1 Answers

In the gatsby-node.js file you need to use a regular old function, namely graphql().

In React land/components you can use tagged templates as shown in your second example. This is because Gatsby among other things then uses Babel to extract that query and runs it.

user_101640920
Related