Electron生产构建版本无法加载Chrome扩展问题求助

你遇到的问题是Electron的loadExtension API不支持读取asar归档文件内部的目录，虽然Electron的fs模块默认做了asar适配，可以正常访问asar内的路径，但Chromium的扩展加载底层逻辑没有对接asar虚拟文件系统，无法识别归档内的目录结构，所以会抛出目录不存在的错误。

解决方案1：将扩展目录排除出asar打包（推荐） #

通过electron-builder配置把扩展目录标记为不打包进asar的资源，构建后会以物理文件夹形式存在于app.asar.unpacked目录中：

1. 修改项目package.json中的electron-builder配置，新增asarUnpack规则：

{
  "build": {
    "asar": true,
    "asarUnpack": [
      "src/build/extensions/**/*"
    ]
  }
}

2. 调整扩展路径拼接逻辑，兼容开发和生产环境：

const isDev = process.env.NODE_ENV !== 'production'
const extenPath = isDev 
  ? path.join(__dirname, "build/extensions/extension_name")
  : path.join(process.resourcesPath, "app.asar.unpacked", "src", "build", "extensions", "extension_name")
const response = await session.defaultSession.loadExtension(extenPath)

解决方案2：运行时拷贝扩展到物理目录 #

如果不想破坏asar包的完整性，可以在应用启动时将asar内的扩展文件拷贝到用户数据目录后再加载：

1. 先安装fs-extra依赖简化文件操作：npm install fs-extra
2. 修改加载逻辑：

const fs = require('fs-extra')
const { app, session } = require('electron')

const getExtensionPath = async () => {
  // 开发环境直接返回本地路径
  if (process.env.NODE_ENV !== 'production') {
    return path.join(__dirname, "build/extensions/extension_name")
  }
  // 生产环境目标路径：用户数据目录下的extensions文件夹
  const targetPath = path.join(app.getPath('userData'), 'extensions', 'extension_name')
  // 避免重复拷贝
  if (!await fs.pathExists(targetPath)) {
    const sourcePath = path.join(__dirname, "build/extensions/extension_name")
    await fs.copy(sourcePath, targetPath)
  }
  return targetPath
}

// 调用加载
const extenPath = await getExtensionPath()
const response = await session.defaultSession.loadExtension(extenPath)

额外注意事项 #

• Electron 13.x版本仅支持Manifest V2格式的Chrome扩展，如果你使用的是Manifest V3扩展需要额外做适配处理
• 构建后可以检查dist/win-unpacked/resources/app.asar.unpacked目录，确认扩展文件是否正常解压

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