Production build failing: Image generation

[williamtstanley]

Description

During a recent refactor of our site we moved more images into remoteFileNodes so that we could take advantage of the GatsbyImage component. As we added more image queries we started to see netlify builds fail. Repeated attempts would sometimes work.

The most recent update included a number more images and now netlify builds die (after approximately 10 minutes) and even local production builds are failing.

Gatsby develop works as expected and renders correctly with no issue.

Gatsby build runs through the "generating thumbnails" section and then dies on HTML generation with missing images.

Steps to reproduce

I don't know how I would make a simple Repo to reproduce this. As its a fair number of pages and images before we started to see this issue.

Expected result

Build should not fail when compiling. If Develop mode works it should ideally work in production too.

Actual result

Production build fails with missing images that are present in development.

Generating image thumbnails [==============================] 3/3 0.6 secs 100%
success run graphql queries — 5.057 s — 127/127 25.12 queries/second
success write out page data — 0.003 s
success write out redirect data — 0.000 s
Generating image thumbnails [==============================] 2392/2392 179.2 secs 100%

info bootstrap finished - 188.706 s

⠂ onPostBootstrapdone generating icons for manifest
success onPostBootstrap — 0.089 s
success Building production JavaScript and CSS bundles — 4.728 s

error Building static HTML for pages failed

See our docs page on debugging HTML builds for help https://goo.gl/yL9lND

   9 |   <div className="chevron__banner-container">
  10 |     <div className="chevron__banner-web">
> 11 |       <Img fluid={props.image.childImageSharp.fluid} />
     |                                               ^
  12 |       <div className="chevron__banner-text">
  13 |         <h4 className="chevron__banner-subtitle">{props.subtitle}</h4>
  14 |         <div className="chevron__banner-title">{props.title}</div>


  WebpackError: TypeError: Cannot read property 'fluid' of null

Environment

System:
OS: Linux 4.17 Pop!_OS 18.04 LTS
CPU: x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
Shell: 4.4.19 - /bin/bash
Binaries:
Node: 10.10.0 - ~/.nvm/versions/node/v10.10.0/bin/node
npm: 6.4.1 - ~/.nvm/versions/node/v10.10.0/bin/npm
Browsers:
Chrome: 69.0.3497.100
Firefox: 62.0
npmPackages:
gatsby: next => 2.0.0-rc.28
gatsby-image: ^2.0.0-rc.1 => 2.0.10
gatsby-plugin-emotion: next => 2.0.0-rc.5
gatsby-plugin-facebook-analytics: next => 2.0.0-rc.1
gatsby-plugin-google-analytics: next => 2.0.0-rc.2
gatsby-plugin-manifest: ^2.0.2-rc.1 => 2.0.4
gatsby-plugin-netlify: next => 2.0.0-rc.6
gatsby-plugin-offline: ^2.0.0-rc.7 => 2.0.5
gatsby-plugin-react-helmet: next => 3.0.0-rc.1
gatsby-plugin-robots-txt: ^1.2.0 => 1.3.0
gatsby-plugin-sass: next => 2.0.0-rc.2
gatsby-plugin-sharp: ^2.0.0-rc.7 => 2.0.5
gatsby-plugin-stripe-elements: ^1.0.7 => 1.0.8
gatsby-source-filesystem: ^2.0.1-rc.6 => 2.0.1
gatsby-transformer-sharp: ^2.1.1-rc.3 => 2.1.2
npmGlobalPackages:
gatsby-cli: 2.4.1
gatsby: 2.0.5

[williamtstanley]

Possibly related to #8056 as they have an issue with a very large number of images being generated compared to v1?

[williamtstanley]

Follow up. If I go back a few commits before the most recent image update the generated thumbnail amount is 1900 and the build will succeed. However not always... that seems to be right at the line of timing out or what ever is happening.

[kakadiadarpan]

@williamtstanley Let's continue this issue discussion on #8056.

Closing in favor of #8056