Electron加载扩展

步骤

Edge扩展

Edge的扩展位置为

C:Users你的用户名AppDataLocalMicrosoftEdgeUser DataDefaultExtensions

我们可以看到这样的文件夹

Edge中输入

代码语言：javascript复制

edge://extensions/

进入扩展页面

在浏览器中找到所需扩展的ID

我这里需要的是kmpfgkgaimakokfhgdahhiaaiidiphco

项目根目录添加文件夹extensions

把我们所需的扩展添加进来

加载扩展

Electron 9及以上

代码语言：javascript复制

const { app, session } = require('electron')
const path = require('path')

app.on('ready', async () => {
    let extension_path = path.join(
        process.cwd(),
        "extensions",
        "kmpfgkgaimakokfhgdahhiaaiidiphco",
        "2.3.0_0"
    );
    await session.defaultSession.loadExtension(
        extension_path,
        // 打开本地文件也应用拓展
        {allowFileAccess: true}
    )
})

Electron 9以下

代码语言：javascript复制

const path = require('path')

let extension_path = path.join(
    process.cwd(),
    "extensions",
    "kmpfgkgaimakokfhgdahhiaaiidiphco",
    "2.3.0_0"
);
BrowserWindow.addDevToolsExtension(extension_path)

注意

不支持打包后的扩展(如.crx文件) 运行时会报好多警告，不影响插件加载。

打包可用

为了保证开发时和打包后扩展均可用

1. main.js中扩展根目录路径使用process.cwd()获取
2. package.json中extraFiles中添加扩展文件夹

代码语言：javascript复制

{
  "build": {
    "files": [
      "main.js",
      "*.html",
      "images/**/*",
      "app.ico",
      "node_modules/**/*"
    ],
    "extraFiles": [
      "./extensions"
    ],
  },
}

不要把扩展的路径只写在files下，否则打包后不可用。

校验扩展是否生效

我们可以访问

https://www.psvmc.cn/login.json

加载扩展前是这样的

加载后是这样的

javascript 打包 electron

0 人点赞