Electron与Canvas同项目使用出现模块版本不匹配错误，如何解决？

问题 #

单独使用Canvas和Electron JS时均无报错，但在同一项目中使用时出现如下错误：

App threw an error during load
Error: The module '\\?\C:\Users\scray\OneDrive\Masaüstü\discord-v14\elektron\node_modules\canvas\build\Release\canvas.node'
was compiled against a different Node.js version using
NODE_MODULE_VERSION 115. This version of Node.js requires
NODE_MODULE_VERSION 121. Please try re-compiling or re-installing
the module (for instance, using `npm rebuild` or `npm install`).
    at process.func [as dlopen] (node:electron/js2c/node_init:2:2214)
    at Module._extensions..node (node:internal/modules/cjs/loader:1343:18)
    at Object.func [as .node] (node:electron/js2c/node_init:2:2214)
    at Module.load (node:internal/modules/cjs/loader:1098:32)
    at Module._load (node:internal/modules/cjs/loader:945:12)
    at c._load (node:electron/js2c/node_init:2:13672)
    at Module.require (node:internal/modules/cjs/loader:1122:19)
    at require (node:internal/modules/helpers:130:18)
    at Object.<anonymous> (C:\Users\scray\OneDrive\Masa├╝st├╝\discord-v14\elektron\node_modules\canvas\lib\bindings.js:3:18)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)

已尝试重新安装模块、升级Node.js至最新版本，请问该如何正常使用Canvas？

解决方案 #

• 安装electron-rebuild作为开发依赖，它会自动匹配Electron的Node版本重新编译native模块：

  npm install --save-dev electron-rebuild
  

• 运行重新编译命令：

  npx electron-rebuild
  

• 如果上述操作无效，执行以下完整清理重建流程：
  1. 删除项目中的node_modules文件夹和package-lock.json文件：
     • Windows系统：

       rmdir /s /q node_modules && del package-lock.json
       

     • macOS/Linux系统：

       rm -rf node_modules package-lock.json
       

  2. 重新安装所有依赖：

     npm install
     

  3. 再次运行electron-rebuild：

     npx electron-rebuild
     

• 可选：在package.json的scripts字段中添加重建脚本，方便后续快速执行：

  "scripts": {
    "rebuild": "electron-rebuild"
  }
  

  之后只需运行npm run rebuild即可完成重建操作。

内容的提问来源于stack exchange，提问作者Cahan uuu