gatsby: [bug]: sharp and image processing failures

Description

In this issue, I’d like to collect any issues others have run into regarding image processing failures with Gatsby. These should be focused on build failures and not warnings. For instance–if a failure occurred installing Sharp, note what the error message was and any additional environment details that would be helpful for debugging the issue. Typically, these will be things like Node version, version of gatsby, version of sharp, etc. (gatsby info --clipboard will be very helpful here) and consider following the template below to craft your reply.

Also note: this is not only for issues that you don’t have a solution for. If you had an issue with image processing + Gatsby and were able to solve it, please 1) edit/update your reply, or 2) provide a comment with the fix.

But… why?

If we can track on the most common issues people are encountering, we can make upstream improvements to our dependencies and also update our documentation to avoid issues in the future, where appropriate. Win/win!

Template

Please use the below template to add your issue, if at all possible!

## High-level error message or summary

> Paste the actual one or two line error

### Solution

<!-- If applicable -->

### Stacktrace

<!-- Full stacktrace, if applicable -->

### Environment info

<!-- Please paste the result of `npx gatsby clipboard --info` or `gatsby clipboard --info` if globally installed -->

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 1
  • Comments: 23 (6 by maintainers)

Most upvoted comments

I’ve got a set of images linked from mdx files that are consistently skipped during gatsby build process. This can be observed in this branch.

The result occurs both locally and when deployed. Click here for the netlify preview built

Also worth noting that the images are repeated in two images subfolders under /content/blog and fail to process in both.

The images appear as expected in development with gatsby develop

No errors, traces, warnings, or other indications of failure occur.

Unable to build Sharp

Can’t run a fresh yarn install.

../src/common.cc:25:10: fatal error: vips/vips8: No such file or directory
 #include <vips/vips8>

Reproducing

Run gatsby new, remove all but the below in package.json, delete node_modules and run yarn install.

{
  "dependencies": {
    "gatsby": "^2.13.73",
    "gatsby-plugin-manifest": "^2.2.6",
    "styled-components": "^4.3.2"
  }
}

If I remove styled-components it works great, but I think there are more plugins that can be the third plugin in the dependencies list above and still reproduce the same error.

Solution

Currently, I need to remove the gatsby-plugin-manifest, run yarn install and then add it with yarn add gatsby-plugin-manifest.

Stacktrace

[4/4] Rebuilding all packages...
[-/5] ⠠ waiting...
[-/5] ⠠ waiting...
[-/5] ⠠ waiting...
[4/5] ⠠ sharp
error /home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp: Command failed.
Exit code: 1
Command: (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)
Arguments:
Directory: /home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp
Output:
gyp info it worked if it ends with ok
gyp info using node-gyp@3.8.0
gyp info using node@10.16.1 | linux | x64
gyp info spawn /usr/bin/python2
gyp info spawn args [ '/home/hannes/workspace/mycompany/myproject/gatsby-theme/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   '/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp/build/config.gypi',
gyp info spawn args   '-I',
gyp info spawn args   '/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/node-gyp/addon.gypi',
gyp info spawn args   '-I',
gyp info spawn args   '/home/hannes/.node-gyp/10.16.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=/home/hannes/.node-gyp/10.16.1',
gyp info spawn args   '-Dnode_gyp_dir=/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/node-gyp',
gyp info spawn args   '-Dnode_lib_file=/home/hannes/.node-gyp/10.16.1/<(target_arch)/node.lib',
gyp info spawn args   '-Dmodule_root_dir=/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp',
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=.' ]
gyp info spawn make
gyp info spawn args [ 'BUILDTYPE=Release', '-C', 'build' ]
make: Entering directory '/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp/build'
  TOUCH Release/obj.target/libvips-cpp.stamp
  CXX(target) Release/obj.target/sharp/src/common.o
  ../src/common.cc:25:10: fatal error: vips/vips8: No such file or directory
   #include <vips/vips8>
            ^~~~~~~~~~~~
compilation terminated.
sharp.target.mk:128: recipe for target 'Release/obj.target/sharp/src/common.o' failed
make: Leaving directory '/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp/build'
make: *** [Release/obj.target/sharp/src/common.o] Error 1
gyp ERR! build error
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (events.js:198:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Linux 5.0.0-23-generic
gyp ERR! command "/snap/node/2485/bin/node" "/home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/.bin/node-gyp" "rebuild"
gyp ERR! cwd /home/hannes/workspace/mycompany/myproject/gatsby-theme/node_modules/sharp

Environment info

$ gatsby info
  System:
    OS: Linux 5.0 Pop!_OS 18.04 LTS
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 4.4.20 - /bin/bash
  Languages:
    Python: 2.7.15+ - /usr/bin/python
  Browsers:
    Chrome: 76.0.3809.100
    Firefox: 68.0.1
$ node --version
v10.16.1

I have installed node as a snap package:

$ snap list node
Name  Version  Rev   Tracking  Publisher    Notes
node  10.16.1  2485  10        nodesource✓  classic

@arturhenryy Hey artur, thanks for your response, this was indeed related to having no swapspace available, I followed the instructions in the stackoverflow link you provided and it build successfully, Thanks a lot!

@Saint2Laurent this error occurs when your server has no or not enough swapspace available. check this thread. not really related to the original question here https://stackoverflow.com/questions/26193654/node-js-catch-enomem-error-thrown-after-spawn

Error: VipsImage: unable to write to

Attempting to build the example using-gatsby-image fails, no changes made.

libvips should be installed fine afaik as it’s worked on other projects with the Docker image I’ve been using. I am copying over my own binaries/versions for libvips(8.7.0), and imagemin mozjpeg,cwebp-bin,pngquant-bin for musl compatible versions.

Stacktrace

error Failed to process image /site/.cache/gatsby-source-filesystem/d1ab1dbb3ab71d828ca1bb0c2f95bcfc/photo-1505904909252-8ce17de9f287.jpg


  Error: VipsImage: unable to write to "/tmp/vips-0-394339043.v"
  unix error: Not supported

(sharp:41): GLib-CRITICAL **: 02:50:27.966: g_hash_table_lookup: assertion 'hash_table != NULL' failed

(sharp:41): GLib-CRITICAL **: 02:50:28.050: g_hash_table_lookup: assertion 'hash_table != NULL' failed

I can confirm that libvips has written jpg images to /tmp successfully, just not this .v file.

The later lines about GLib I’m not sure if they’re actually related from what I’ve read about the error, though this is Alpine which uses musl instead of libc, but I am using the correct version, pulling the following:

LIBVIPS_VERSION="8.7.0"
LIBVIPS_PLATFORM="linuxmusl"
"https://github.com/lovell/sharp-libvips/releases/download/v${LIBVIPS_VERSION}/libvips-${LIBVIPS_VERSION}-${LIBVIPS_PLATFORM}-x64.tar.gz" 

Solution

Turns out to be a problem with running libvips on Alpine and writing to /tmp. There is an expected fix with upcoming 8.7.1.

Environment info

gatsby info seems to just hang, I assume it’s trying to do something that isn’t supported on Alpine or that I’m missing a package for. gatsby -v outputs v2.4.8.

package.json:

{
  "name": "using-gatsby-image",
  "private": true,
  "description": "Gatsby example site using using-gatsby-image",
  "author": "Kyle Mathews <mathews.kyle@gmail.com>",
  "dependencies": {
    "emotion": "^9.2.12",
    "emotion-server": "^9.2.12",
    "gatsby": "^2.0.36",
    "gatsby-image": "^2.0.19",
    "gatsby-plugin-emotion": "^2.0.6",
    "gatsby-plugin-netlify": "^2.0.3",
    "gatsby-plugin-sharp": "^2.0.11",
    "gatsby-plugin-typography": "^2.2.1",
    "gatsby-source-filesystem": "^2.0.7",
    "gatsby-transformer-sharp": "^2.1.7",
    "gatsby-transformer-yaml": "^2.1.4",
    "numeral": "^2.0.6",
    "react": "^16.6.0",
    "react-dom": "^16.6.0",
    "react-emotion": "^9.2.12",
    "react-icons": "^3.2.1",
    "react-typography": "^0.16.13",
    "typeface-oswald": "0.0.54",
    "typeface-pt-sans": "0.0.54",
    "typography": "^0.16.6"
  },
  "license": "MIT",
  "main": "n/a",
  "scripts": {
    "develop": "gatsby develop",
    "build": "gatsby build",
    "start": "npm run develop"
  }
}

i would like to reference this issue here #10347 localfile creation for images are silently failing. it is already recognized as a bug but it seems that it has been forgotten about, although this is a pretty critical bug imo.