Solvednode canvas node-canvas cannot be built on Heroku.
✔️Accepted Answer
(I wasn't sure if it would be better for me to create a new issue for this, as what I'm sharing is related to this one and I thought we could perhaps re-open this one to continue with its background information, but please let me know if I submit a new one instead)
I've been having the same problems trying to reliably deploy an application to Heroku. It seems like only very specific version combinations work such as the example stack as described by @zbjornson. If I try the same exact build on Node 12.x.x
LTS for example, it results in the build failing.
I think the issue is that only the very specific version combinations that have prebuilt packages can be deployed without an issue on Heroku, with any build-from-source alternative failing. But I can't be entirely sure about this, as the results are not 100% predictable (I am not sure why 12.16.x
does not work, for example. I believe that should still be considered v79
, for which there is a prebuilt package?)
I tried several version combinations to try to see if I could make sense of things, but even though there are prebuilt packages available it does not always seem to work in the way that I expected.
I tested all these on the heroku-18
stack using zbjornson's example code, modifying only the engine target in package.json:
- v13.x.x fails
- v13.0.x succeeds
- v13.3.0 succeeds
- v12.x.x fails
- v12.0.x succeeds
- v12.16.x fails
- v14.0.x fails
- v14.1.x fails
Basically it seems that the build fails because it is unable to locate the 'pangocairo' package, even though both cairo and pango are available in the stack from what I can tell, though perhaps not the "dev" version needed for building. I had also attempted to use something like a cairo buildpack but all of these seem to have been built based on the no longer supported cedar-14
stack.
The wiki entry on the subject should probably be updated as the currently described method isn't really feasible anymore. I wish I could suggest these changes myself, but so far I am unable to get a successful build from source working on Heroku.
===
What follows is some logs in case it helps:
Targeting Node 12.x.x
fails:
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote: NODE_VERBOSE=false
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): 12.x.x
remote: engines.npm (package.json): unspecified (use default)
remote: engines.yarn (package.json): unspecified (use default)
remote:
remote: Resolving node version 12.x.x...
remote: Downloading and installing node 12.16.3...
remote: Using default npm version: 6.14.4
remote: Resolving yarn version 1.x...
remote: Downloading and installing yarn (1.22.4)...
remote: Installed yarn 1.22.4
remote:
remote: -----> Installing dependencies
remote: Installing node modules (yarn.lock)
remote: yarn install v1.22.4
remote: warning package.json: No license field
remote: warning No license field
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: [3/4] Linking dependencies...
remote: [4/4] Building fresh packages...
remote: error /tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas: Command failed.
remote: Exit code: 1
remote: Command: node-pre-gyp install --fallback-to-build
remote: Arguments:
remote: Directory: /tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas
remote: Output:
remote: Package pangocairo was not found in the pkg-config search path.
remote: Perhaps you should add the directory containing `pangocairo.pc'
remote: to the PKG_CONFIG_PATH environment variable
remote: No package 'pangocairo' found
remote: gyp: Call to 'pkg-config pangocairo --libs' returned exit status 1 while in binding.gyp. while trying to load binding.gyp
remote: gyp ERR! configure error
remote: gyp ERR! stack Error: `gyp` failed with exit code: 1
remote: gyp ERR! stack at ChildProcess.onCpExit (/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16)
remote: gyp ERR! stack at ChildProcess.emit (events.js:310:20)
remote: gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
remote: gyp ERR! System Linux 4.4.0-1062-aws
remote: gyp ERR! command "/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/bin/node" "/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--module=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release" "--napi_version=5" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v72"
remote: gyp ERR! cwd /tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas
remote: gyp ERR! node -v v12.16.3
remote: gyp ERR! node-gyp -v v5.1.0
remote: gyp ERR! not ok
remote: node-pre-gyp ERR! build error
remote: node-pre-gyp ERR! stack Error: Failed to execute '/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/bin/node /tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release --napi_version=5 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v72' (1)
remote: node-pre-gyp ERR! stack at ChildProcess.<anonymous> (/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
remote: node-pre-gyp ERR! stack at ChildProcess.emit (events.js:310:20)
remote: node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:1021:16)
remote: node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
remote: node-pre-gyp ERR! System Linux 4.4.0-1062-aws
remote: node-pre-gyp ERR! command "/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/bin/node" "/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build"
remote: node-pre-gyp ERR! cwd /tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas
remote: node-pre-gyp ERR! node -v v12.16.3
remote: node-pre-gyp ERR! node-pre-gyp -v v0.11.0
remote: node-pre-gyp ERR! not ok
remote: Failed to execute '/tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/bin/node /tmp/build_a35192172a2725106dbf4b3280ef7f0c/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/tmp/build_a35192172a2725106dbf4b3280ef7f0c/node_modules/canvas/build/Release --napi_version=5 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v72' (1)
remote: info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: If you're stuck, please submit a ticket so we can help:
remote: https://help.heroku.com/
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to canvas-test-versions.
remote:
Targeting Node 13.x.x
fails the same way:
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote: NODE_VERBOSE=false
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): 13.x.x
remote: engines.npm (package.json): unspecified (use default)
remote: engines.yarn (package.json): unspecified (use default)
remote:
remote: Resolving node version 13.x.x...
remote: Downloading and installing node 13.14.0...
remote: Using default npm version: 6.14.4
remote: Resolving yarn version 1.x...
remote: Downloading and installing yarn (1.22.4)...
remote: Installed yarn 1.22.4
remote:
remote: -----> Installing dependencies
remote: Installing node modules (yarn.lock)
remote: yarn install v1.22.4
remote: warning package.json: No license field
remote: warning No license field
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: [3/4] Linking dependencies...
remote: [4/4] Building fresh packages...
remote: error /tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas: Command failed.
remote: Exit code: 1
remote: Command: node-pre-gyp install --fallback-to-build
remote: Arguments:
remote: Directory: /tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas
remote: Output:
remote: Package pangocairo was not found in the pkg-config search path.
remote: Perhaps you should add the directory containing `pangocairo.pc'
remote: to the PKG_CONFIG_PATH environment variable
remote: No package 'pangocairo' found
remote: gyp: Call to 'pkg-config pangocairo --libs' returned exit status 1 while in binding.gyp. while trying to load binding.gyp
remote: gyp ERR! configure error
remote: gyp ERR! stack Error: `gyp` failed with exit code: 1
remote: gyp ERR! stack at ChildProcess.onCpExit (/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16)
remote: gyp ERR! stack at ChildProcess.emit (events.js:315:20)
remote: gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
remote: gyp ERR! System Linux 4.4.0-1062-aws
remote: gyp ERR! command "/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/bin/node" "/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--module=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release/canvas.node" "--module_name=canvas" "--module_path=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release" "--napi_version=6" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v79"
remote: gyp ERR! cwd /tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas
remote: gyp ERR! node -v v13.14.0
remote: gyp ERR! node-gyp -v v5.1.0
remote: gyp ERR! not ok
remote: node-pre-gyp ERR! build error
remote: node-pre-gyp ERR! stack Error: Failed to execute '/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/bin/node /tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v79' (1)
remote: node-pre-gyp ERR! stack at ChildProcess.<anonymous> (/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
remote: node-pre-gyp ERR! stack at ChildProcess.emit (events.js:315:20)
remote: node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:1026:16)
remote: node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
remote: node-pre-gyp ERR! System Linux 4.4.0-1062-aws
remote: node-pre-gyp ERR! command "/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/bin/node" "/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build"
remote: node-pre-gyp ERR! cwd /tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas
remote: node-pre-gyp ERR! node -v v13.14.0
remote: node-pre-gyp ERR! node-pre-gyp -v v0.11.0
remote: node-pre-gyp ERR! not ok
remote: Failed to execute '/tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/bin/node /tmp/build_a7db9f776306b52997ce6a59f5fbf658/.heroku/node/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --module=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release/canvas.node --module_name=canvas --module_path=/tmp/build_a7db9f776306b52997ce6a59f5fbf658/node_modules/canvas/build/Release --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v79' (1)
remote: info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: If you're stuck, please submit a ticket so we can help:
remote: https://help.heroku.com/
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to canvas-test-versions.
remote:
Targeting 13.3.0
specifically results in a successful deploy:
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote: NODE_VERBOSE=false
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): 13.3.0
remote: engines.npm (package.json): unspecified (use default)
remote: engines.yarn (package.json): unspecified (use default)
remote:
remote: Resolving node version 13.3.0...
remote: Downloading and installing node 13.3.0...
remote: Using default npm version: 6.13.1
remote: Resolving yarn version 1.x...
remote: Downloading and installing yarn (1.22.4)...
remote: Installed yarn 1.22.4
remote:
remote: -----> Installing dependencies
remote: Installing node modules (yarn.lock)
remote: yarn install v1.22.4
remote: warning package.json: No license field
remote: warning No license field
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: [3/4] Linking dependencies...
remote: [4/4] Building fresh packages...
remote: Done in 5.26s.
remote:
remote: -----> Build
remote:
remote: -----> Pruning devDependencies
remote: yarn install v1.22.4
remote: warning package.json: No license field
remote: warning No license field
remote: [1/4] Resolving packages...
remote: [2/4] Fetching packages...
remote: [3/4] Linking dependencies...
remote: [4/4] Building fresh packages...
remote: warning Ignored scripts due to flag.
remote: Done in 0.81s.
remote:
remote: -----> Caching build
remote: - yarn cache
remote:
remote: -----> Build succeeded!
remote: -----> Discovering process types
remote: Procfile declares types -> (none)
remote: Default types for buildpack -> web
remote:
remote: -----> Compressing...
remote: Done: 60.2M
remote: -----> Launching...
remote: Released v3
remote: https://canvas-test-versions.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
Other Answers:
well node-canvas doesnt work on heroku is there any documentation ???
It does work, but you need to use specific version combinations as not all combinations are available in pre-built form. Try the specific versions others have also reported as working and it should work for you too.
Issue or Feature
node-canvas cannot be deployed to heroku without it erroring out.
Steps to Reproduce
Simply try to deploy a module to heroku with node-canvas as its dependency, it will output this mess.
Your Environment
npm list canvas
oryarn list canvas
): 2.6.1