Hybrid approach for gatsby-source-contentful plugin, to set downloadLocal: true when in Netlify build, but on local to set it to false.

[alexPetkov92]

Hi guys,

Is there a way this to be done, because i am hiting a wall when trying to change queries to use gatsbyImageData or localFile;

export function generateQuery(input) {
  const isNetlify = process.env.NETLIFY === "true"

  return input.replace(
    /gatsbyImageData\s*\([^)]*\)|gatsbyImageData/g,
    match => {
      if (isNetlify) {
        return `localFile {
                childImageSharp {
                  ${match}
                }
              }`
      } else {
        return match
      }
    }
  )
}

I have the above function, to which i pass the query string, the idea is to find the gatsbyImageData and nest it inside localFile {} when the build is running on NETLIFY, so i can basically use NETLIFY as the CDN when users request a page.

But i get this error when i load the page:

It appears like Gatsby is misconfigured. Gatsby related graphql calls are supposed to only be evaluated at compile time, and then compiled away. Unfortunately, something went wrong and the query was left in the compiled code. Unless your site has a complex or custom babel/Gatsby configuration this is likely a bug in Gatsby.

These are the options for gatsby-source-contentful:

  {
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: process.env.CONTENTFUL_SPACE_ID,
        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
        // host: process.env.CONTENTFUL_HOST,
        enableTags: true,
        locale: "en-US",
        downloadLocal: process.env.NETLIFY ? true : false,
        environment: process.env.CONTENTFUL_ENVIRONMENT_ID,
      },
    },

So is it possible to make this hybrid approach in Gatsby, in netlify to set donwloadLocal to true and on local development to false
Please let me know if you need any other code.