
If you've tried deploying [`node-canvas`](https://github.com/Automattic/node-canvas) on Netlify, you may have encountered a few errors.

## Incompatible Architecture

If you're deploying to Netlify using the CLI and you're not running linux, the errors may involve complaints about incompatible architecture.

`node-canvas` will build its binaries based on the architecture doing the install, so if you're deploying what you built locally (not linux) to Netlify (linux), it will complain. Easiest thing here is to do deploys via the Netlify's auto-deploy or via the UI so that the packages are built on the right architecture.

There's a way to `npm install` forcing the architecture, but at first thought this sounds like it may not run or build locally if it depends on the availability of local libs. Not sure, haven't tried.

## Bundle Size Exceeded

If you're using `node-canvas` in functions you may get a successful build, but see an error to the effect of:

`The function zip XXX.zip size is X MB, which is larger than the maximum supported size of Y MB`

It will then show you the list of large files contributing to this issue, and they'll most likely be `.so` files in the `node-canvas` directory. The biggest offender tends to be `librsvg`.

If you need svg support, I'm sorry.

If you don't need svg support, the good news is that [svg support is optional](https://github.com/Automattic/node-canvas/issues/1954) in `node-canvas`. *You just* have to build it without the modules you don't want.

The bad news is that while there are instructions for how to do this on the `node-canvas` [wiki](https://github.com/Automattic/node-canvas/wiki), getting it going on Netlify is not entirely straight-forward.

If you're building on linux, this may work if you do the custom build locally then deploy via CLI. If you're not using linux, you'll likely encounter the architecture issue above.

One solution I saw was to [use a Docker/multipass instance to build a custom version of `node-canvas`](https://answers.netlify.com/t/node-canvas-error-libuuid-so-1-cannot-open-shared-object-file-no-such-file-or-directory/30179/6) then as part of the build process, copy those files the shared instance folder into `node_modules` before running the app build, but that sounded like a right pain in the derrière.

Some people said that worked for them though, so yay for them.

## My Solution

Use [`pureimage`](https://github.com/joshmarinacci/node-pureimage) instead.

It's not entirely a drop-in replacement for `node-canvas`, but it's close. There are a few quirks, but nothing I haven't got a comparatively straight-forward workaround for, and it beats faffing around with complicated build and deploy strategies.


1 posts tagged “canvas”

Server-Side Canvas on Netlify