Electron-Forge Webpack模板集成puppeteer-extra-plugin-stealth时模块缺失错误

问题场景 #

基于Electron-Forge官方Webpack模板创建的项目初始启动正常，安装playwright、playwright-extra、puppeteer-extra-plugin-stealth后，仅导入puppeteer-extra-plugin-stealth就触发以下错误：

App threw an error during load
Error: Cannot find module 'is-plain-object'

尝试过两种配置方案但未解决：

• 在webpack.main.config.js/webpack.renderer.config.js添加externals配置，出现新错误：Error: Cannot find module 'require('playwright-extra')'
• 在forge.config.js的configureWebpack中添加externals，仍触发原模块缺失错误

注：原生Electron项目、未使用Webpack模板的Electron-Forge项目均可正常运行该依赖组合。

附项目package.json：

{
  "name": "electron-forge-webpack",
  "productName": "electron-forge-webpack",
  "version": "1.0.0",
  "description": "My Electron application description",
  "main": ".webpack/main",
  "scripts": {
    "start": "electron-forge start",
    "package": "electron-forge package",
    "make": "electron-forge make",
    "publish": "electron-forge publish",
    "lint": "echo \"No linting configured\""
  },
  "devDependencies": {
    "@electron-forge/cli": "^7.3.0",
    "@electron-forge/maker-deb": "^7.3.0",
    "@electron-forge/maker-rpm": "^7.3.0",
    "@electron-forge/maker-squirrel": "^7.3.0",
    "@electron-forge/maker-zip": "^7.3.0",
    "@electron-forge/plugin-auto-unpack-natives": "^7.3.0",
    "@electron-forge/plugin-fuses": "^7.2.0",
    "@electron-forge/plugin-webpack": "^7.3.0",
    "@electron/fuses": "^1.7.0",
    "@vercel/webpack-asset-relocator-loader": "1.7.3",
    "css-loader": "^6.0.0",
    "electron": "29.1.0",
    "node-loader": "^2.0.0",
    "style-loader": "^3.0.0"
  },
  "keywords": [],
  "author": {
    "name": "John Doe",
    "email": "john@doe.com"
  },
  "license": "MIT",
  "dependencies": {
    "@playwright/browser-chromium": "^1.42.0",
    "electron-squirrel-startup": "^1.0.0",
    "playwright": "^1.42.0",
    "playwright-extra": "^4.3.6",
    "puppeteer-extra-plugin-stealth": "^2.11.2"
  }
}

解决方案 #

方案1：修正Webpack Externals配置格式 #

之前的externals配置存在引号嵌套错误，正确写法是使用commonjs前缀声明模块类型，而非嵌套require()调用：

若在主进程使用依赖，修改webpack.main.config.js：

module.exports = {
  // 保留原有其他配置
  externals: {
    playwright: "commonjs playwright",
    "playwright-extra": "commonjs playwright-extra",
    "puppeteer-extra-plugin-stealth": "commonjs puppeteer-extra-plugin-stealth",
    "is-plain-object": "commonjs is-plain-object" // 显式声明缺失的依赖
  }
};

若在渲染进程使用，同步修改webpack.renderer.config.js的externals配置。

方案2：排除依赖的Asset Relocator处理 #

Electron-Forge的Webpack插件默认使用@vercel/webpack-asset-relocator-loader重定位模块，该处理可能破坏playwright相关库的依赖结构。在forge.config.js中配置排除这些库：

module.exports = {
  // 保留原有其他配置
  plugins: [
    {
      name: '@electron-forge/plugin-webpack',
      config: {
        mainConfig: './webpack.main.config.js',
        renderer: {
          // 保留原有渲染进程配置
        },
        assetRelocatorOptions: {
          exclude: [
            'playwright',
            'playwright-extra',
            'puppeteer-extra-plugin-stealth',
            'is-plain-object'
          ]
        }
      }
    }
  ]
};

方案3：手动安装缺失依赖并配合externals #

先安装报错的is-plain-object依赖：

npm install is-plain-object --save

再按方案1的正确格式配置Webpack externals，确保Webpack不打包这些依赖，保留原生Node.js的require引用。

验证步骤 #

1. 删除node_modules目录和package-lock.json文件
2. 执行npm install重新安装所有依赖
3. 运行npm start测试项目启动情况

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