Gatsby deployement error - Cannot return null for non-nullable field ImageSharp.gatsbyImageData

PLEASE help us help you by writing a good post!

Netlify site name : https://karadegdauce.netlify.app/

I get an error only in deployement step when I run npm run build or gatsby build, everything works fine in localhost. It is related to the following query in my dynamic pages :

import * as React from 'react'
import { graphql } from 'gatsby'
import { GatsbyImage, getImage } from 'gatsby-plugin-image'

import Layout from '../../components/layout'
import SEO from '../../components/seo'

const BlogPost = ({data, children}) => {

  console.log(data)
  const images = data.mdx.frontmatter.hero_image.childrenImageSharp;
  const imageData = images.length > 0 ? images[0].gatsbyImageData : null;
  const image = imageData ? getImage(imageData) : null;

  console.log(images)
  
  return (
    <Layout pageTitle={data.mdx.frontmatter.title}>
      <p>Posted: {data.mdx.frontmatter.date}</p>
      {image && (
        <GatsbyImage
          image={image}
          alt={data.mdx.frontmatter.hero_image_alt}
        />
      )}
      <p>
        Photo Credit:{" "}
        <a href={data.mdx.frontmatter.hero_image_credit_link}>
          {data.mdx.frontmatter.hero_image_credit_text}
        </a>
      </p>
      {children} 
    </Layout>
  )
}

export const query = graphql`
query ($id: String) {
  mdx(id: {eq: $id}) {
    frontmatter {
      title
      date(formatString: "MMMM D, YYYY")
      hero_image_credit_text
      hero_image_credit_link
      hero_image_alt
      hero_image {
        childrenImageSharp {
          gatsbyImageData
        }
      }
    }
  }
}
`

export const Head = ({data}) => <SEO title={data.mdx.frontmatter.title} description={undefined} pathname={undefined} children={undefined} />

export default BlogPost

Log from the build command :

11:10:23 AM: build-image version: c88e1420630449f4a2fd995ed7cd2ef80eeab5f6 (focal)
11:10:23 AM: buildbot version: c88e1420630449f4a2fd995ed7cd2ef80eeab5f6
11:10:23 AM: Fetching cached dependencies
11:10:23 AM: Starting to download cache of 224.9MB
11:10:27 AM: Finished downloading cache in 3.889s
11:10:27 AM: Starting to extract cache
11:10:29 AM: Finished extracting cache in 2.518s
11:10:29 AM: Finished fetching cache in 6.472s
11:10:29 AM: Starting to prepare the repo for build
11:10:30 AM: Preparing Git Reference refs/heads/main
11:10:31 AM: Starting to install dependencies
11:10:31 AM: Python version set to 3.8
11:10:32 AM: Attempting Ruby version 2.7.2, read from environment
11:10:32 AM: Using Ruby version 2.7.2
11:10:33 AM: Started restoring cached go cache
11:10:33 AM: Finished restoring cached go cache
11:10:33 AM: go version go1.19.13 linux/amd64
11:10:33 AM: Using PHP version 8.0
11:10:34 AM: Started restoring cached Node.js version
11:10:35 AM: Finished restoring cached Node.js version
11:10:35 AM: v18.19.0 is already installed.
11:10:35 AM: Now using node v18.19.0 (npm v10.2.3)
11:10:35 AM: Enabling Node.js Corepack
11:10:35 AM: Started restoring cached build plugins
11:10:35 AM: Finished restoring cached build plugins
11:10:35 AM: Started restoring cached corepack dependencies
11:10:35 AM: Finished restoring cached corepack dependencies
11:10:35 AM: No npm workspaces detected
11:10:35 AM: Started restoring cached node modules
11:10:35 AM: Finished restoring cached node modules
11:10:36 AM: Installing npm packages using npm version 10.2.3
11:10:37 AM: npm WARN ERESOLVE overriding peer dependency
11:10:37 AM: npm WARN While resolving: react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
11:10:37 AM: npm WARN Found: react@18.2.0
11:10:37 AM: npm WARN node_modules/react
11:10:37 AM: npm WARN   react@"^18.2.0" from the root project
11:10:37 AM: npm WARN   9 more (@gatsbyjs/reach-router, @mdx-js/react, gatsby, ...)
11:10:37 AM: npm WARN
11:10:37 AM: npm WARN Could not resolve dependency:
11:10:37 AM: npm WARN peer react@"0.0.0-experimental-c8b778b7f-20220825" from react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
11:10:37 AM: npm WARN node_modules/react-server-dom-webpack
11:10:37 AM: npm WARN   react-server-dom-webpack@"0.0.0-experimental-c8b778b7f-20220825" from gatsby@5.13.0
11:10:37 AM: npm WARN   node_modules/gatsby
11:10:37 AM: npm WARN
11:10:37 AM: npm WARN Conflicting peer dependency: react@0.0.0-experimental-c8b778b7f-20220825
11:10:37 AM: npm WARN node_modules/react
11:10:37 AM: npm WARN   peer react@"0.0.0-experimental-c8b778b7f-20220825" from react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
11:10:37 AM: npm WARN   node_modules/react-server-dom-webpack
11:10:37 AM: npm WARN     react-server-dom-webpack@"0.0.0-experimental-c8b778b7f-20220825" from gatsby@5.13.0
11:10:37 AM: npm WARN     node_modules/gatsby
11:10:41 AM: up to date, audited 1516 packages in 5s
11:10:41 AM: 341 packages are looking for funding
11:10:41 AM:   run `npm fund` for details
11:10:41 AM: 11 moderate severity vulnerabilities
11:10:41 AM: To address issues that do not require attention, run:
11:10:41 AM:   npm audit fix
11:10:41 AM: To address all issues (including breaking changes), run:
11:10:41 AM:   npm audit fix --force
11:10:41 AM: Run `npm audit` for details.
11:10:41 AM: npm packages installed
11:10:41 AM: Successfully installed dependencies
11:10:41 AM: Starting build script
11:10:42 AM: Detected 1 framework(s)
11:10:42 AM: "gatsby" at version "5.13.0"
11:10:42 AM: Section completed: initializing
11:10:44 AM: ​
11:10:44 AM: Netlify Build                                                 
11:10:44 AM: ────────────────────────────────────────────────────────────────
11:10:44 AM: ​
11:10:44 AM: ❯ Version
11:10:44 AM:   @netlify/build 29.31.1
11:10:44 AM: ​
11:10:44 AM: ❯ Flags
11:10:44 AM:   baseRelDir: true
11:10:44 AM:   buildId: 6585608df6cc2d00080f4439
11:10:44 AM:   deployId: 6585608df6cc2d00080f443b
11:10:44 AM: ​
11:10:44 AM: ❯ Current directory
11:10:44 AM:   /opt/build/repo
11:10:44 AM: ​
11:10:44 AM: ❯ Config file
11:10:44 AM:   No config file was defined: using default values.
11:10:44 AM: ​
11:10:44 AM: ❯ Context
11:10:44 AM:   production
11:10:44 AM: ​
11:10:44 AM: ❯ Loading plugins
11:10:44 AM:    - @netlify/plugin-gatsby@3.8.0 from Netlify app
11:10:45 AM: ​
11:10:45 AM: @netlify/plugin-gatsby (onPreBuild event)                     
11:10:45 AM: ────────────────────────────────────────────────────────────────
11:10:45 AM: ​
11:10:45 AM: Skipping @netlify/plugin-gatsby work, because used Gatsby version supports adapters.
11:10:45 AM: ​
11:10:45 AM: (@netlify/plugin-gatsby onPreBuild completed in 59ms)
11:10:45 AM: ​
11:10:45 AM: Build command from Netlify app                                
11:10:45 AM: ────────────────────────────────────────────────────────────────
11:10:45 AM: ​
11:10:45 AM: $ gatsby clean && npm run build
11:10:46 AM: info Deleting .cache, public, /opt/build/repo/node_modules/.cache/babel-loader, /opt/build/repo/node_modules/.cache/terser-webpack-plugin
11:10:46 AM: info Successfully deleted directories
11:10:46 AM: > portfolio@1.0.0 build
11:10:46 AM: > gatsby build
11:10:49 AM: success compile gatsby files - 1.265s
11:10:49 AM: success load gatsby config - 0.023s
11:10:53 AM: success Installing Netlify adapter (gatsby-adapter-netlify@^1.0.4) - 4.141s
11:10:53 AM: info If you plan on staying on this deployment platform, consider installing gatsby-adapter-netlify as a dependency in your project. This will give you faster and more robust installs.
11:10:53 AM: info Using gatsby-adapter-netlify adapter
11:10:54 AM: info [gatsby-adapter-netlify] Found a Gatsby cache. We"re about to go FAST. ⚡
success load plugins - 0.247s
11:10:54 AM: success onPreInit - 0.004s
11:10:54 AM: success delete worker cache from previous builds - 0.001s
11:10:54 AM: info One or more of your plugins have changed since the last time you ran Gatsby. As
11:10:54 AM: a precaution, we"re deleting your site"s cache to ensure there"s no stale data.
success initialize cache - 0.062s
11:10:54 AM: success copy gatsby files - 0.074s
11:10:55 AM: success Compiling Gatsby Functions - 0.170s
11:10:55 AM: success onPreBootstrap - 0.189s
11:10:55 AM: success createSchemaCustomization - 0.004s
11:10:55 AM: success Clean up stale nodes - 0.005s - 0/0 0.00/s
11:10:55 AM: success Checking for changed pages - 0.000s
11:10:55 AM: success source and transform nodes - 0.600s
11:10:56 AM: info Writing GraphQL type definitions to /opt/build/repo/.cache/schema.gql
11:10:57 AM: success building schema - 1.189s
11:10:57 AM: success createPages - 0.002s
11:10:57 AM: success createPagesStatefully - 0.313s
11:10:57 AM: info Total nodes: 41, SitePage nodes: 7 (use --verbose for breakdown)
11:10:57 AM: success Checking for changed pages - 0.000s
11:10:57 AM: success Cleaning up stale page-data - 0.001s
11:10:57 AM: success onPreExtractQueries - 0.000s
11:11:03 AM: success extract queries from components - 6.300s
11:11:03 AM: success write out redirect data - 0.001s
11:11:03 AM: success onPostBootstrap - 0.001s
11:11:03 AM: info bootstrap finished - 16.928s
11:11:03 AM: success write out requires - 0.002s
11:11:05 AM: warning `isModuleDeclaration` has been deprecated, please migrate to `isImportOrExportDeclaration`
11:11:05 AM:     at isModuleDeclaration (/opt/build/repo/node_modules/@babel/types/lib/validators/generated/index.js:2748:35)
11:11:05 AM:     at PluginPass.Program (/opt/build/repo/node_modules/babel-plugin-lodash/lib/index.js:102:44)
11:11:07 AM: success Building production JavaScript and CSS bundles - 3.621s
11:11:08 AM: success Building HTML renderer - 1.360s
11:11:08 AM: success Execute page configs - 0.036s
11:11:08 AM: success Caching Webpack compilations - 0.000s
11:11:08 AM: error There was an error in your GraphQL query:
11:11:08 AM: Cannot return null for non-nullable field ImageSharp.gatsbyImageData.
11:11:08 AM: The field "ImageSharp.gatsbyImageData." was explicitly defined as non-nullable via the schema customization API (by yourself or a plugin/theme). This means that this field is not optional and you have to define a value. If this is not your desired behavior and you defined the schema yourself, go to "createTypes" in gatsby-node.
11:11:08 AM:    1 | query pageOptbuildreposrcpagesblogmdxFrontmatterSlugTsxContentFilePathoptbuildrepobloganotherPostindexMdx1535113228($id: String) {
11:11:08 AM:    2 |   mdx(id: {eq: $id}) {
11:11:08 AM:    3 |     frontmatter {
11:11:08 AM:    4 |       title
11:11:08 AM:    5 |       date(formatString: "MMMM D, YYYY")
11:11:08 AM:    6 |       hero_image_credit_text
11:11:08 AM:    7 |       hero_image_credit_link
11:11:08 AM:    8 |       hero_image_alt
11:11:08 AM:    9 |       hero_image {
11:11:08 AM:   10 |         childrenImageSharp {
11:11:08 AM: > 11 |           gatsbyImageData
11:11:08 AM:      |           ^
11:11:08 AM:   12 |         }
11:11:08 AM:   13 |       }
11:11:08 AM:   14 |     }
11:11:08 AM:   15 |   }
11:11:08 AM:   16 | }
11:11:08 AM: File path: /opt/build/repo/src/pages/blog/{mdx.frontmatter__slug}.tsx?__contentFilePath=/opt/build/repo/blog/another-post/index.mdx
11:11:08 AM: Url path: /blog/another-post/
11:11:08 AM: Plugin: none
11:11:09 AM: error An error occurred during parallel query running.
11:11:09 AM: Go here for troubleshooting tips: https://gatsby.dev/pqr-feedback
11:11:09 AM: 
11:11:09 AM: 
11:11:09 AM:   Error: Worker exited before finishing task
11:11:09 AM:   
11:11:09 AM:   - index.js:205 ChildProcess.<anonymous>
11:11:09 AM:     [repo]/[gatsby-worker]/dist/index.js:205:41
11:11:09 AM:   
11:11:09 AM: 
11:11:09 AM: not finished run queries in workers - 0.448s
11:11:10 AM: ​
11:11:10 AM: "build.command" failed                                        
11:11:10 AM: ────────────────────────────────────────────────────────────────
11:11:10 AM: ​
11:11:10 AM:   Error message
11:11:10 AM:   Command failed with exit code 1: gatsby clean && npm run build (https://ntl.fyi/exit-code-1)
11:11:10 AM: ​
11:11:10 AM:   Error location
11:11:10 AM:   In Build command from Netlify app:
11:11:10 AM:   gatsby clean && npm run build
11:11:10 AM: ​
11:11:10 AM:   Resolved config
11:11:10 AM:   build:
11:11:10 AM:     command: gatsby clean && npm run build
11:11:10 AM:     commandOrigin: ui
11:11:10 AM:     publish: /opt/build/repo/public
11:11:10 AM:     publishOrigin: ui
11:11:10 AM:   plugins:
11:11:10 AM:     - inputs: {}
11:11:10 AM:       origin: ui
11:11:10 AM:       package: "@netlify/plugin-gatsby"
11:11:14 AM: Failed during stage "building site": Build script returned non-zero exit code: 2
11:11:14 AM: Build failed due to a user error: Build script returned non-zero exit code: 2
11:11:14 AM: Failing build: Failed to build site
11:11:14 AM: Finished processing build request in 51.242s

Here is my deploy settings :

Do you have any idea ? I find nothing both on internet and chatGpt for now. Thank you for any reply !

I forgot to add that the query returns the good output in localhost also, please find below the settings for my plugins :

graphqlTypegen: true,
  plugins: [
    "gatsby-plugin-sharp",
    "gatsby-transformer-sharp",
    "gatsby-plugin-image",
    {
      resolve: "gatsby-source-filesystem",
      options: {
        name: `blog`,
        path: `${__dirname}/blog`,
      }
    },
    "gatsby-plugin-mdx",
  ],

You can try setting the environment variable here: Need clarification on disabling PARALLEL_QUERY_RUNNING at a runtime · gatsbyjs/gatsby · Discussion #34473 · GitHub to something like 1.