Build error: Graphql "Input file contains unsupported image format"

Description

Some types of images cause Gatsby to throw an error during build. There’s no error message or context that shows which specific image is causing the problem.

While I’m pretty sure the actual error lies in a dependency of Gatsby, may aim with this bug report is to find out how to figure out which image is causing the problem. That, I believe, Gatsby could tell me.

I have a site with ~2k images, and some of them throw this error. It’s quite laborious to try to figure out which ones by trial an error!

Steps to reproduce

This is a 2 repo project. I’ve setup both repos with branches that show a minimum reproduction of this problem.

• Checkout https://github.com/chmac/open-source-ios/tree/graphql-error-minimum-repro
• Be sure to checkout the graphql-error-minimum-repro branch
• cd gatsby && yarn && yarn build
• Warning: The build script will create a sibling director to the repo called open-source-ios-apps and download a file from GitHub into that directory

Here’s the URLs to the 4 images in the reproduction, any one of which will generate this error:

• https://github.com/ThasianX/DivRise/blob/develop/AppPhotos/portfolio.png
• https://github.com/ThasianX/DivRise/blob/develop/AppPhotos/details.png
• https://github.com/ThasianX/DivRise/blob/develop/AppPhotos/income.png
• https://github.com/SeekingMini/MoneyPlus/blob/master/images/screenshot-1.png

Expected result

Should build!

Actual result

 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Input file contains unsupported image format

Environment

Gatsby environment

  npmPackages:
    gatsby: ^2.24.56 => 2.24.56 
    gatsby-image: ^2.4.17 => 2.4.17 
    gatsby-plugin-manifest: ^2.4.28 => 2.4.28 
    gatsby-plugin-material-ui: ^2.1.10 => 2.1.10 
    gatsby-plugin-offline: ^3.2.27 => 3.2.27 
    gatsby-plugin-react-helmet: ^3.3.10 => 3.3.10 
    gatsby-plugin-sharp: ^2.6.34 => 2.6.34 
    gatsby-plugin-typescript: ^2.4.19 => 2.4.19 
    gatsby-source-filesystem: ^2.3.29 => 2.3.29 
    gatsby-transformer-json: ^2.4.11 => 2.4.11 
    gatsby-transformer-sharp: ^2.5.14 => 2.5.14 
  npmGlobalPackages:
    gatsby-cli: 1.1.46
    gatsby-dev-cli: 1.2.12
    gatsby: 2.0.18

[KyleAMathews]

Also could you try installing the latest version of gatsby-plugin-sharp (if you haven’t already) to make sure you’re getting fixes we have rolled out for these error messages?

[AleksandrHovhannisyan]

In my case, it turned out to be me using .gitattributes with LF for everything, including images. This resulted in corrupted image files. Oops 😄 Hope that helps someone out there (it probably won’t).