Server-Side Canvas on Netlify
If you've tried deploying 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 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, 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
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
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.