NodeJS 将Keytar与电子应用程序打包

x0fgdtte  于 2022-12-12  发布在  Node.js
关注(0)|答案(3)|浏览(176)

我正在使用electron-builder(16.6.2)来打包我的电子应用程序,其中包括keytar(3.0.2)作为一个prod依赖项。
package.json文件包括:

"scripts": {
    "postinstall": "install-app-deps",
    "compile:dev": "webpack-dev-server --hot --host 0.0.0.0 --config=./webpack.dev.config.js",
    "compile": "webpack --config webpack.build.config.js",
    "dist": "yarn compile && build"
},
"build": {
    "appId": "com.myproject",
    "asar": true,
    "files": [
      "bin",
      "node_modules",
      "main.js"
    ]
}

当我在同一个系统上运行.app时,它运行正常。当我尝试在不同的系统上运行它(或删除我的node_modules)时,它找不到keytar. node。当keytar被构建时,它包含了一个指向我的系统的映像的完全限定路径。我在控制台中得到以下错误:

Uncaught Error: Cannot open /Users/Kevin/Work/myproject/node_modules/keytar/build/Release/keytar.node
Error: dlopen(/Users/Kevin/Work/myproject/node_modules/keytar/build/Release/keytar.node, 
1): image not found

我一定是在构建过程中遗漏了一个步骤。

iezvtpos

iezvtpos1#

事实证明,我在渲染器进程中使用了keytar,我把keytar移到了主进程中(它不经过Webpack / Babel),并被electron-builder正确打包。
main.js

ipcMain.on('get-password', (event, user) => {
    event.returnValue = keytar.getPassword('ServiceName', user);
});

ipcMain.on('set-password', (event, user, pass) => {
    event.returnValue = keytar.replacePassword('ServiceName', user, pass);
});

然后从渲染器进程调用

const password = ipcRenderer.sendSync('get-password', user);

ipcRenderer.sendSync('set-password', user, pass);
gkl3eglg

gkl3eglg2#

window.require("electron").remote.require("keytar")

因为您正在使用渲染器进程,并且希望使用来自系统或主进程的本机API。

c7rzv4ha

c7rzv4ha3#

更新日期:

我发现(根据OP),转换我的主线程代码(使用keytar)导致调用返回TypeError: keytar.findPassword is not a function的keytar函数。
我不得不使用webpack-asset-relocator-loader来成功地捆绑keytar:

npm i -DE @vercel/webpack-asset-relocator-loader

将以下规则添加到webpack.config.js中:

module: {
  rules: [{
    test: /\.node$/,
    parser: { amd: false },
    use: {
      loader: "@vercel/webpack-asset-relocator-loader",
      options: {
        outputAssetBase: "native_modules"
      }
    }
  },
  // <other rules>
  ],
  // rest of config
}

在此Github问题中找到解决方案。
下面的信息仍然代表在您的Webpack构建中包含二进制资源。
如果您必须转换需要二进制文件的代码,您可以将file-loader添加到您的webpack配置中。

安装

npm i -D file-loader

yarn add -D file-loader

Webpack配置(包括一个.dat文件)

...,
module: {
  rules: [{
    ...
  }, {
    test: /\.dat$/,
    use: {
      loader: "file-loader"
    }
  }]
},
...

如果要保留文件名,可以将name选项传递给加载器:

use: {
  loader: "file-loader",
  options: {
    name: "[name].[ext]"
  }
}

有关file-loader Github repo的更多信息。

相关问题