gatsby-source-contentful options error on build

Question

some time back I made a site with Gatsby and I've used static markdown for my pages. Now I wanted to move all my posts on Contentful and everything works fine in development. When I went on Netlify to deploy my website it threw me an error. I've looked for solutions but haven't found one yet. I tried to run the build locally and it throws me this error, so I believe I need to fix this first before deploying.

ERROR 

Problems with gatsby-source-contentful plugin options:
spaceId: undefined - "spaceId" is required
accessToken: undefined - "accessToken" is required
host (default value): "cdn.contentful.com"
environment (default value): "master"
downloadLocal (default value): false
localeFilter (default value): [Function]
forceFullSync (default value): false
pageLimit (default value): 100
useNameForId (default value): true

not finished onPreBootstrap - 0.056s
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! gatsby-starter-hello-world@0.1.0 build: `gatsby build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the gatsby-starter-hello-world@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\user\AppData\Roaming\npm-cache\_logs\2020-05-13T15_20_35_160Z-debug.log

Apparently it does not read the .env variables. I do have the variables set on Netlify and as I said earlier on development it works just fine without throwing any kind of error.

I did not have 'dotenv' installed before and tried to install it but did not solve the issue. I do have only one '.env' file, but have tried to make '.env.development' and '.env.production' files but did not work.

How can I fix the problem? As an extra I do get some errors, on Netlify only, such as

error There was an error in your GraphQL query:
Unknown type "ContentfulFluid". 

but I do not think they cause the build to fail.

EDIT: I should add that if I do write the .env variables as strings the build does run locally, which makes me believe it would do on deployment.

Answer 1

In the environment variable .env.development you need to add

CONTENTFUL_SPACE_ID = <Paste here your space Id>
CONTENTFUL_ACCESS_TOKEN = <Paste here your delivery API - access token>

Answer 2

After many attempts trying to debug my code and installing previous versions of gatsby-source-contentful I found out that you would get an error if you have no Media on contentful. To fix any similar error all you need to do is add a dummy media on contentful itself and it would work just fine.

Answer 3

You have to set your .env variables in Netlify with GATSBY_ prefix. So, your CONTENTFUL_ID variable will be GATSBY_CONTENTFUL_ID.

It's recommended to use the same naming in your local and build environment to keep the logic between them. So, you will need to prefix all references to .env using GATSBY_ in your local environment too. To do this, you may need to create a .env.development and .env.production if you haven't set it before.

You can check for further information in Netlify documentation:

Gatsby environment variables

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

As well as in Gatsby's documentation.