Netlify deployment Cannot query field "allContentfulGallery" on type "Query"

Question

I am creating an application on React.js, Gatsby.js, and Contentful. My Application is working fine on my local but when I deploy my app to Natilify Cannot query field "allContentfulGallery" on type "Query". And My GraphQl Queries are also working fine. Please help me I am very sticking by this error."allContentfulGallery" is my collection Name

Very thanks in advance

My gatsby-node.js configuration

  const galleryResult = await graphql(`
    query gallery {
      allContentfulGallery {
        edges {
          node {
            title
            slug
            images {
              title
              file {
                url
              }
            }
            sys {
              contentType {
                sys {
                  id
                  linkType
                  type
                }
              }
              revision
              type
            }
          }
        }
      }
    }
  `)  
  var galleryArr =
    galleryResult &&
    galleryResult.data &&
    galleryResult.data.allContentfulGallery &&
    galleryResult.data.allContentfulGallery.edges
  galleryArr.forEach(edge => {
    createPage({
      path: `/gallery/${edge.node.slug}`,
      component: galleryTemplate,
      context: {
        title: edge.node.title,
        slug: edge.node.slug,
        sys: {
          ...edge.node.sys,
        },
      },
    })
  })

"My Application is working fine on my local" --> means that running gatsby build works? Have you uploaded your Contentful API keys in Netlify? — Ferran Buireu
– Ferran Buireu, Commented May 4, 2021 at 7:57
Yes, the gatsby build working fine for me on my local, and App working fine. and yes I have uploaded API keys to my GitLab and Netlify is auto-sync with Gitlab. — Vishnu Chauhan
– Vishnu Chauhan, Commented May 4, 2021 at 8:09
are they prefixed with GATSBY_ gatsbyjs.com/docs/how-to/local-development/… ? — Ferran Buireu
– Ferran Buireu, Commented May 4, 2021 at 8:45
No .env having like CONTENTFUL_ENVIRONMENT='master' and gatsby-config having environment: process.env.CONTENTFUL_ENVIRONMENT ? process.env.CONTENTFUL_ENVIRONMENT : "master", — Vishnu Chauhan
– Vishnu Chauhan, Commented May 4, 2021 at 8:56

Ferran Buireu · Accepted Answer · 2021-05-04 09:09:17Z

It seems (according to the comments) that the environment variables are not properly set, since they work locally (under both environments, gatsby develop and gatsby build) but not on GitLab nor Netlify.

Dealing with Gatsby + Netlify requires to prefix all environment variables with GATSBY_ as you can see in Netlify docs:

Any environment variables prefixed with GATSBY_ are processed by Gatsby and made available in the browser for client-side JavaScript access. Visit the Gatsby docs about environment variables for more information.

So, change all variables locally, and in Netlify's and GitLab dashboard prefixing them with GATSBY_.

CONTENTFUL_ENVIRONMENT
CONTENTFUL_API_KEY
CONTENTFUL_SPACE_ID

Will become:

GATSBY_CONTENTFUL_ENVIRONMENT
GATSBY_CONTENTFUL_API_KEY
GATSBY_CONTENTFUL_SPACE_ID

Keep in mind that this approach applies to all environment variables, not only for the Contentful ones.

Normally I'm pretty sure about the resolutions but in your case, if you haven't set the environment variables properly, the plugin configuration should fail, breaking the compilation before your issue prompts and it's not the case.

Collectives™ on Stack Overflow

Netlify deployment Cannot query field "allContentfulGallery" on type "Query"

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related