node-canvas 属于 Node 原生模块，如果要运行，需要根据计算机架构重新编译，并且由于 vscode 基于 electron，原生模块编译也需要遵循 electron 要求。
如果不重新编译就会出现报错：
Activating extension 'x' failed: The module '/Users/x/studio/vscode-background/node_modules/canvas/build/Release/canvas.node' was compiled against a different Node.js version using NODE_MODULE_VERSION 106. This version of Node.js requires NODE_MODULE_VERSION 116. Please try re-compiling or re-installing the module
在 vscode 插件使用 node-canvas
安装
npm install canvas
编译
electron 原生模块编译说明 Native Node Modules
安装 node-gyp
npm i -g node-gyp
node-canvas 的编译根据不同系统环境还需要做一些预准备（跨平台嘛）说明
| OS | Command |
|---|---|
| OS X | Using Homebrew: brew install pkg-config cairo pango libpng jpeg giflib librsvg pixman |
| Ubuntu | sudo apt-get install build-essential libcairo2-dev libpango1.0-dev libjpeg-dev libgif-dev librsvg2-dev |
| Fedora | sudo yum install gcc-c++ cairo-devel pango-devel libjpeg-turbo-devel giflib-devel |
| Solaris | pkgin install cairo pango pkg-config xproto renderproto kbproto xextproto |
| OpenBSD | doas pkg_add cairo pango png jpeg giflib |
| Windows | See the wiki |
| Others | See the wiki |
完成后
cd node_modules/canvas
node-gyp rebuild --target=25.9.7 --arch=arm64 --dist-url=https://electronjs.org/headers
注意：笔者第一次重新编译时发现未成功，原因似乎是node-gyp判断存在 build 目录就跳过了，所以如果编译未成功，可以将node_modules/canvas/build目录删除再编译
- target: vscode electron 版本，vscode 的 electron 版本号可以通过「菜单栏 - 关于」查看到
- arch：系统架构
