macOS ARM64环境下Electron项目安装canvas库失败求助

问题根源 #

1. 你使用的canvas@2.11.2没有适配Node.js 18（node-v108 ABI）的macOS ARM64预编译包，导致自动 fallback 到源码编译
2. 源码编译失败是因为缺失C++标准库依赖，本质是Xcode命令行工具未正确配置

具体解决步骤 #

1. 升级canvas到兼容版本 #

旧版本canvas对ARM64和新Node.js版本的支持不足，先卸载旧版本并安装最新稳定版：

npm uninstall canvas
npm install canvas@latest

2. 配置完整的C++编译环境 #

源码编译需要Xcode命令行工具提供的C++标准库，执行以下命令确保环境完整：

# 安装Xcode命令行工具
xcode-select --install
# 接受Xcode许可协议
sudo xcodebuild -license accept

完成后重启终端，再尝试安装canvas。

3. 使用electron-rebuild适配Electron的ABI #

Electron的Node ABI与系统Node可能存在差异，需要重新编译canvas以适配Electron：
首先安装electron-rebuild开发依赖：

npm install --save-dev electron-rebuild

然后运行重建命令：

npx electron-rebuild -f -w canvas

如果你的Electron版本明确，可指定版本以避免适配错误：

npx electron-rebuild -f -w canvas --electron-version=你的Electron版本号

4. 手动安装canvas依赖的系统库 #

如果源码编译仍失败，通过Homebrew安装canvas所需的底层依赖库：

brew install pkg-config cairo pango libpng jpeg giflib librsvg

安装canvas时指定依赖路径：

PKG_CONFIG_PATH="/opt/homebrew/lib/pkgconfig" npm install canvas

5. 临时方案：切换到Rosetta模式（仅当以上方法均无效时） #

通过Rosetta模拟x86环境安装：

• 打开终端，右键选择「显示简介」，勾选「使用Rosetta打开」
• 重新激活你的Node版本：

nvm use 18.13.0
npm install canvas

内容的提问来源于stack exchange，提问作者Mukul Rawat