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,
},
},
})
})
It seems (according to the comments) that the environment variables are not properly set, since they work locally (under both environments,
gatsby develop
andgatsby 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:
So, change all variables locally, and in Netlify's and GitLab dashboard prefixing them with
GATSBY_
.Will become:
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.