How do you pass a variable from 'context' to a page query? | Gatsby

user_9307475 0
Viewed 657

Attempting to pass a 'context' variable to a page query I get an error telling me the variable isn't provided.

From my gatsby-node.js file:

createPage({
  path: `/portfolio/${pg.order}`,
  component: require.resolve("./src/pages/portfolio.js"),
  context: { pgNum: pg.order },
})

My page query:

export const query = graphql`
  query($pgNum: Int!) {
    strapiPortfolioPages(order: { eq: $pgNum }) {
      layer
      widths
      ...
    }
  }

Gatsby tells me: "Variable "$pgNum" of required type "Int!" was not provided."

gatsby
1 Answers

"Variable "$pgNum" of required type "Int!" was not provided."

This means that your $pgNum variable is non-nullable because of the Int! since the exclamation mark (!) stands for a non-nullable (required) value in GraphQL(for further information check the Schema and Types GraphQL documentation). In other words, your query is passing a null value to a non-nullable variable so you have a null value somewhere.

An easy way to bypass it (after checking your values) is removing the nullability of the query by:

export const query = graphql`
  query($pgNum: Int) {
    strapiPortfolioPages(order: { eq: $pgNum }) {
      layer
      widths
      ...
    }
  }
user_55853710
Related