After upgrading Gastby to use New Builds functionality getting error: static HTML failed for path "/blog/contentful-int"

Description

After upgrading Gastby to use New Builds functionality getting error: static HTML failed for path “/blog/contentful-int” when trying to deploy a build on Gatsby Cloud. However the I can still build locally without errors.

Package.json

{
  "name": "gatsby-starter-hello-world",
  "private": true,
  "description": "A simplified bare-bones starter for Gatsby",
  "version": "0.1.0",
  "license": "MIT",
  "scripts": {
    "build": "gatsby build",
    "develop": "GATSBY_GRAPHQL_IDE=playground gatsby develop",
    "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "clean": "gatsby clean",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
  },
  "dependencies": {
    "@contentful/rich-text-react-renderer": "^13.4.0",
    "gatsby": "^2.19.7",
    "gatsby-cli": "^2.8.22",
    "gatsby-plugin-manifest": "^2.2.34",
    "gatsby-plugin-react-helmet": "^3.1.18",
    "gatsby-plugin-sass": "^2.1.26",
    "gatsby-plugin-sharp": "^2.4.3",
    "gatsby-remark-images": "^3.1.39",
    "gatsby-remark-relative-images": "^0.2.3",
    "gatsby-source-contentful": "^2.1.82",
    "gatsby-source-filesystem": "^2.1.43",
    "gatsby-transformer-remark": "^2.6.45",
    "node-sass": "^4.13.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-helmet": "^5.2.1"
  },
  "devDependencies": {
    "env-cmd": "^10.0.1",
    "prettier": "^1.19.1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/gatsbyjs/gatsby-starter-hello-world"
  },
  "bugs": {
    "url": "https://github.com/gatsbyjs/gatsby/issues"
  }
}

Steps to reproduce

1. With a site using Contentful as a CMS… 1.upgrade the Gatsby packages to use Distributed Builds functionality.

"gatsby": "^2.19.7",
"gatsby-cli": "^2.8.22",
"gatsby-source-contentful": "^2.1.82",
"gatsby-plugin-sharp": "^2.4.3",

1. Try to build site on Gatsby Cloud.
2. See if error occurs.

Expected result

Build should complete without error.

Actual result

Build is failing with error.

Environment

  System:
    OS: macOS Mojave 10.14.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 11.1.0 - ~/.nvm/versions/node/v11.1.0/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.13.6 - ~/.nvm/versions/node/v11.1.0/bin/npm
  Languages:
    Python: 3.6.0 - /Users/jvajda/.pyenv/shims/python
  Browsers:
    Chrome: 79.0.3945.130
    Firefox: 72.0.2
    Safari: 13.0.4
  npmPackages:
    gatsby: ^2.19.7 => 2.19.7
    gatsby-cli: ^2.8.22 => 2.8.22
    gatsby-plugin-manifest: ^2.2.34 => 2.2.34
    gatsby-plugin-react-helmet: ^3.1.18 => 3.1.18
    gatsby-plugin-sass: ^2.1.26 => 2.1.26
    gatsby-plugin-sharp: ^2.4.3 => 2.4.3
    gatsby-remark-images: ^3.1.39 => 3.1.39
    gatsby-remark-relative-images: ^0.2.3 => 0.2.3
    gatsby-source-contentful: ^2.1.82 => 2.1.82
    gatsby-source-filesystem: ^2.1.43 => 2.1.43
    gatsby-transformer-remark: ^2.6.45 => 2.6.45
  npmGlobalPackages:
    gatsby-cli: 2.8.27

Build Failure Log

15:54:27 PM: From https://github.com/jpvajda/gatsby-test * branch master -> FETCH_HEAD
15:54:27 PM: 0911529..f542f4d master -> origin/master
15:54:27 PM: HEAD is now at f542f4d upgraded contentful package
15:54:27 PM: Already on 'master'
15:54:27 PM: Your branch is up-to-date with 'origin/master'.
15:54:54 PM: > node-sass@4.13.1 install /usr/src/app/www/gatsby-hello-world/node_modules/node-sass > node scripts/install.js
15:54:54 PM: Downloading binary from https://github.com/sass/node-sass/releases/download/v4.13.1/linux-x64-64_binding.node
15:54:55 PM: Download complete
15:54:55 PM: Binary saved to /usr/src/app/www/gatsby-hello-world/node_modules/node-sass/vendor/linux-x64-64/binding.node
15:54:55 PM: > node-sass@4.13.1 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/node-sass > node scripts/build.js
15:54:55 PM: Binary found at /usr/src/app/www/gatsby-hello-world/node_modules/node-sass/vendor/linux-x64-64/binding.node
15:54:55 PM: Testing binary
15:54:55 PM: Binary is fine
15:54:55 PM: > sharp@0.23.4 install /usr/src/app/www/gatsby-hello-world/node_modules/sharp > (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)
15:54:55 PM: info
15:54:55 PM: sharp Using cached /root/.npm/_libvips/libvips-8.8.1-linux-x64.tar.gz
15:54:56 PM: > core-js@2.6.11 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/core-js > node -e "try{require('./postinstall')}catch(e){}"
15:54:57 PM: > cwebp-bin@5.1.0 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/cwebp-bin > node lib/install.js
15:54:57 PM: ✔ cwebp pre-build test passed successfully
15:54:57 PM: > pngquant-bin@5.0.2 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/pngquant-bin > node lib/install.js
15:54:57 PM: ✔ pngquant pre-build test passed successfully
15:54:58 PM: > mozjpeg@6.0.1 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/mozjpeg > node lib/install.js
15:54:58 PM: ✔ mozjpeg pre-build test passed successfully
15:54:58 PM: > gatsby-telemetry@1.1.46 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/gatsby-telemetry > node src/postinstall.js || true
15:54:58 PM: > gatsby-cli@2.8.22 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/gatsby-cli > node scripts/postinstall.js
15:54:59 PM: > fsevents@1.2.11 install /usr/src/app/www/gatsby-hello-world/node_modules/fsevents > node-gyp rebuild
15:54:59 PM: (node:9360) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 SIGINT listeners added. Use emitter.setMaxListeners() to increase limit
15:54:59 PM: gyp
15:54:59 PM: info it worked if it ends with ok
15:54:59 PM: gyp
15:54:59 PM: info using node-gyp@3.8.0 gyp info using node@10.18.1 | linux | x64
15:54:59 PM: gyp info
15:54:59 PM: spawn /usr/bin/python2 gyp info spawn args [ '/root/.nvm/versions/node/v10.18.1/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py', gyp info spawn args 'binding.gyp', gyp info spawn args '-f', gyp info spawn args 'make', gyp info spawn args '-I', gyp info spawn args '/usr/src/app/www/gatsby-hello-world/node_modules/fsevents/build/config.gypi', gyp info spawn args '-I', gyp info spawn args '/root/.nvm/versions/node/v10.18.1/lib/node_modules/npm/node_modules/node-gyp/addon.gypi', gyp info spawn args '-I', gyp info spawn args '/root/.node-gyp/10.18.1/include/node/common.gypi', gyp info spawn args '-Dlibrary=shared_library', gyp info spawn args '-Dvisibility=default', gyp info spawn args '-Dnode_root_dir=/root/.node-gyp/10.18.1', gyp info spawn args '-Dnode_gyp_dir=/root/.nvm/versions/node/v10.18.1/lib/node_modules/npm/node_modules/node-gyp', gyp info spawn args '-Dnode_lib_file=/root/.node-gyp/10.18.1/<(target_arch)/node.lib', gyp info spawn args '-Dmodule_root_dir=/usr/src/app/www/gatsby-hello-world/node_modules/fsevents', gyp info spawn args '-Dnode_engine=v8', gyp info spawn args '--depth=.', gyp info spawn args '--no-parallel', gyp info spawn args '--generator-output', gyp info spawn args 'build', gyp info spawn args '-Goutput_dir=.' ]
15:54:59 PM: gyp
15:54:59 PM: info spawn make gyp info spawn args [ 'BUILDTYPE=Release', '-C', 'build' ]
15:54:59 PM: make: Entering directory '/usr/src/app/www/gatsby-hello-world/node_modules/fsevents/build'
15:54:59 PM: SOLINK_MODULE(target) Release/obj.target/.node
15:54:59 PM: COPY Release/.node
15:55:00 PM: make: Leaving directory '/usr/src/app/www/gatsby-hello-world/node_modules/fsevents/build'
15:55:00 PM: gyp info ok
15:55:00 PM: > gatsby-telemetry@1.1.47 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/gatsby/node_modules/gatsby-telemetry > node src/postinstall.js || true
15:55:00 PM: > gatsby-cli@2.8.27 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/gatsby/node_modules/gatsby-cli > node scripts/postinstall.js
15:55:00 PM: > core-js-pure@3.6.4 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/core-js-pure > node -e "try{require('./postinstall')}catch(e){}"
15:55:01 PM: > gatsby@2.19.7 postinstall /usr/src/app/www/gatsby-hello-world/node_modules/gatsby > node scripts/postinstall.js
15:55:01 PM: added 2235 packages in 24.779s
15:55:02 PM: Node version v10.18.1
15:55:02 PM: Gatsby version Gatsby CLI version: 2.8.27 Gatsby version: 2.19.7 Note: this is the Gatsby version for the site at: /usr/src/app/www/gatsby-hello-world
15:55:02 PM: BUILDS
15:55:04 PM: success open and validate gatsby-configs - 0.024s
15:55:04 PM: success load plugins - 0.517s
15:55:04 PM: success onPreInit - 0.004s
15:55:05 PM: success delete html and css files from previous builds - 0.021s
15:55:05 PM: info One or more of your plugins have changed since the last time you ran Gatsby. As a precaution, we're deleting your site's cache to ensure there's no stale data.
15:55:05 PM: success initialize cache - 0.015s
15:55:05 PM: success copy gatsby files - 0.028s
15:55:05 PM: success onPreBootstrap - 0.012s
15:55:05 PM: success createSchemaCustomization - 0.145s
15:55:05 PM: Starting to fetch data from Contentful
15:55:05 PM: Fetching default locale
15:55:05 PM: default locale is : en-US
15:55:05 PM: contentTypes fetched 1 Updated entries 6 Deleted entries 0 Updated assets 1 Deleted assets 0 Fetch Contentful data: 267.452ms
15:55:05 PM: success source and transform nodes - 0.537s
15:55:06 PM: success building schema - 0.509s
15:55:06 PM: success createPages - 0.051s
15:55:06 PM: success createPagesStatefully - 0.100s
15:55:06 PM: success onPreExtractQueries - 0.002s
15:55:06 PM: success update schema - 0.032s
15:55:07 PM: success extract queries from components - 0.446s
15:55:07 PM: success write out requires - 0.004s
15:55:07 PM: success write out redirect data - 0.001s
15:55:07 PM: success onPostBootstrap - 0.001s ⠀ info bootstrap finished - 4.479 s ⠀
15:55:17 PM: success Building production JavaScript and CSS bundles - 10.449s
15:55:17 PM: success run queries - 10.725s - 16/16 1.49/s
15:55:19 PM: failed Building static HTML for pages - 1.270s
15:55:19 PM: error Building static HTML failed for path "/blog/contentful-int"
15:55:19 PM: 35 | <h1>{props.data.contentfulBlogPost.title}</h1> 36 | <p>{props.data.contentfulBlogPost.publishedDate}</p> > 37 | {documentToReactComponents(props.data.contentfulBlogPost.body.json)} | ^ 38 | </Layout> 39 | ) 40 | } WebpackError: TypeError: Cannot read property 'json' of null - blog.js:37 Blog src/templates/blog.js:37:69 - extends.js:14 tryOnImmediate node_modules/@babel/runtime/helpers/extends.js:14:1

15:55:19 PM: ERROR Failed to compile: Error: Exited with code 1

[jpvajda]

@t2ca I had an old test blog post with no body content, which seemed to be causing this error. Interesting that the site used to build on Gatsby Cloud with no issues, but now this was throwing an error. Thanks for the help! I just made the blog content field a requirement of all posts on Contentful, so this should happen again.

[t2ca]

You need to checkout contentful to see why the body is null.

I think you could do something like this to remove the error: {documentToReactComponents(props.data.contentfulBlogPost.body && props.data.contentfulBlogPost.body.json)}

or with the new syntax {documentToReactComponents(props.data.contentfulBlogPost?.body?.json)}