Electron打包后运行提示找不到chokidar模块，调试正常如何解决

问题现象 #

• VS Code调试启动开发环境时，以下引入代码可正常运行，文件监听功能无异常：

  const chokidar = require('chokidar');
  

• 使用electron-builder 22.13.1打包（运行环境为macOS 20.2.0、Electron 11.5.0、x64架构）后，启动应用弹出未捕获异常：

  Uncaught Exception:
  Error: Cannot find module 'chokidar'
  

排查与修复方案 #

按优先级从高到低依次排查：

• 检查依赖安装位置
  electron-builder打包时只会将package.json中dependencies字段下的依赖打入安装包，devDependencies下的依赖会被自动剔除。开发环境能正常运行是因为本地node_modules包含全量依赖，打包后缺失生产依赖就会报模块找不到的错误。
  修复方式：执行命令将chokidar写入生产依赖，重新安装后再打包：

  npm install chokidar --save
  # yarn用户执行 yarn add chokidar
  

  安装完成后确认package.json的dependencies中存在chokidar条目，再执行打包流程。

• 检查electron-builder打包配置
  打开项目中electron-builder的配置项（通常在package.json的build字段，或独立的electron-builder.yml文件）：

  • 检查exclude、files配置项，确认没有规则手动排除了node_modules/chokidar路径，无特殊需求不要自定义过滤node_modules下的生产依赖，使用默认打包规则即可
  • 如果开启了asar打包，不要将chokidar加入排除列表，chokidar本身兼容asar打包环境，不需要额外做asarUnpack配置

• 检查主进程构建配置
  如果项目主进程代码使用webpack/rollup/vite等构建工具做了二次打包，需要将chokidar加入构建配置的externals列表，不要将chokidar的源码直接合并进bundle文件，否则会导致构建后的require路径错乱，打包后找不到模块。以webpack为例，配置如下：

  module.exports = {
    // 其余主进程webpack配置
    externals: {
      chokidar: 'commonjs chokidar'
    }
  }
  

• 清理缓存后重试
  以上配置都确认无误仍报错时，清理本地缓存和历史产物后重新构建：

  rm -rf node_modules dist package-lock.json yarn.lock
  npm install
  npm run build
  

额外最佳实践 #

chokidar是依赖Node.js底层fs API的包，不建议直接在渲染进程中引入使用。推荐将所有文件监听逻辑放在主进程实现，监听触发的事件通过IPC通道发送给渲染进程处理，既可以规避大部分打包路径问题，也符合Electron的安全开发规范。

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