在 Electron 中引入本地谷歌插件

在使用 Electron 开发桌面应用程序时，有时我们需要利用 Chrome 插件（如开发者工具扩展、调试工具或其他功能插件）

一、实现步骤

安装必要依赖

在引入本地 Chrome 插件之前，确保已经安装了 Electron 和 electron-devtools-installer 依赖。你可以通过以下命令来安装这些依赖：

复制代码

npm install electron
npm install electron-devtools-installer

配置 Electron 主进程

在 Electron 的主进程文件（通常是 main.js 或 index.js）中，我们需要引入 electron-devtools-installer 并编写代码来加载本地的 Chrome 插件。以下是实现的核心代码：

arduino 复制代码

const { app, session } = require('electron');
const path = require('path');
const installExtension = require('electron-devtools-installer');
app.on("ready", async () => {
  // 创建应用窗口
  createWindow();
  // 确定 Chrome 插件路径，开发环境使用相对路径，生产环境使用绝对路径
  const url = isDevelopment ? `../src/plgu/` : process.cwd() + '\resources\app.asar.unpacked\plgu\';
  const extensionPath = path.resolve(__dirname, url); 
  // 加载 Chrome 插件
  session.defaultSession.loadExtension(extensionPath).then(({ id }) => {
    console.log('插件已加载:', id);
  }).catch((error) => {
    console.error('插件加载失败:', error);
  });
});

使用本地插件

在 Electron 应用的 resources 目录下创建一个子目录 app.asar.unpacked，用于存放未打包的插件文件。将 Chrome 插件的解压文件放入 app.asar.unpacked/plgu 目录中。这样，在应用的生产版本中，Electron 将能够正确地识别和加载这些插件。

代码使用 path.resolve(__dirname, url) 来确保获取插件的绝对路径，无论在开发还是生产环境中都能够正确指向插件所在的目录。

验证插件是否加载成功

在 session.defaultSession.loadExtension 方法的 then 回调中，可以通过插件的 ID 来确认插件是否成功加载。如果加载成功，将在控制台输出插件的 ID 信息，如：

makefile 复制代码

插件已加载: ljjemllljcmogpfapbkkighbhhppjdbg

如果插件加载失败，catch 中的错误信息将帮助定位问题。

二、注意事项

文件路径问题 ：确保指定的插件路径正确无误。在生产环境中，Electron 会将应用打包为 app.asar 文件，因此需要在打包时确保插件目录未被包含在 asar 文件中。
权限问题：在某些操作系统上，加载插件可能需要管理员权限，确保 Electron 应用在有足够权限的环境下运行。