电子锻造v6，Keytar & Node-Loader错误“找不到合适的图像.文件太短”

Question

我很难让键焦油包在电子锻造v6项目中工作(beta.54)。

在刚生成的项目中，我在运行应用程序时会收到一个关于“文件太短”的错误。下面是来自主进程的错误对话框的摘录：

> electron-forge start

✔ Checking your system
✔ Locating Application
✔ Preparing native dependencies: 1 / 1
✔ Compiling Main Process Code
✔ Launch Dev Servers
✔ Compiling Preload Scripts
✔ Launching Application


Webpack Output Available: http://localhost:9000

App threw an error during load
Error: node-loader:
Error: dlopen(/Users/abc/Desktop/app2/.webpack/main/9e6f9bf6669542cb15efba32c033f3de.node, 1): no suitable image found.  Did find:
    /Users/abc/Desktop/app2/.webpack/main/9e6f9bf6669542cb15efba32c033f3de.node: file too short
    /Users/abc/Desktop/app2/.webpack/main/9e6f9bf6669542cb15efba32c033f3de.node: file too short
    at Object.<anonymous> (/Users/abc/Desktop/app2/.webpack/main/index.js:1015:9)
    at Object../node_modules/keytar/build/Release/keytar.node (/Users/abc/Desktop/app2/.webpack/main/index.js:1018:30)
    at __webpack_require__ (/Users/abc/Desktop/app2/.webpack/main/index.js:21:30)
    at Object../node_modules/keytar/lib/keytar.js (/Users/abc/Desktop/app2/.webpack/main/index.js:1029:14)
    at __webpack_require__ (/Users/abc/Desktop/app2/.webpack/main/index.js:21:30)
    at Object../src/index.ts (/Users/abc/Desktop/app2/.webpack/main/index.js:1440:14)
    at __webpack_require__ (/Users/abc/Desktop/app2/.webpack/main/index.js:21:30)
    at /Users/abc/Desktop/app2/.webpack/main/index.js:85:18
    at Object.<anonymous> (/Users/abc/Desktop/app2/.webpack/main/index.js:88:10)
    at Module._compile (internal/modules/cjs/loader.js:1152:30)

看来node-loader在这个包上遇到了麻烦。我无法破译正在发生的事情，因为我可以看到包.node文件被复制到./webpack/main/native_modules中，但是根上有一个散列文件名，它似乎导入了本机文件。

我注意到的一件奇怪的事情是，.webpack/main/9e6f9bf6669542cb15efba32c033f3de.node上的散列文件包含以下内容，而不是本机二进制数据：

module.exports = __non_webpack_require__("./native_modules/build/Release/keytar.node")

后来..。这些.node文件/native_modules/build/Release/keytar.node正是我所期望的。

我们应该如何进行呢？直到我意识到这个问题是从何而来，我才急于在GitHub上公开问题。

我觉得从根本上来说，.node文件是如何在keytar中生成的，但是谁也不知道Webpack和装载机到底发生了什么。

复制步骤

1. 创建一个新的电子伪造项目‘`npx创建-电子应用程序app2 --模板=类型记录-webpack
2. 安装Keytar npm install keytar
3. 将const key tar = require('keytar');添加到src/index.ts中
4. 通过npm run start运行应用程序
5. 体验错误

版本

节点:v14.14

国家预防机制:7.0.13

包JSON依赖关系：

"devDependencies": {
    "@electron-forge/cli": "^6.0.0-beta.54",
    "@electron-forge/maker-deb": "^6.0.0-beta.54",
    "@electron-forge/maker-rpm": "^6.0.0-beta.54",
    "@electron-forge/maker-squirrel": "^6.0.0-beta.54",
    "@electron-forge/maker-zip": "^6.0.0-beta.54",
    "@electron-forge/plugin-webpack": "6.0.0-beta.54",
    "@marshallofsound/webpack-asset-relocator-loader": "^0.5.0",
    "@typescript-eslint/eslint-plugin": "^4.0.1",
    "@typescript-eslint/parser": "^4.0.1",
    "css-loader": "^4.2.1",
    "electron": "11.0.3",
    "eslint": "^7.6.0",
    "eslint-plugin-import": "^2.20.0",
    "fork-ts-checker-webpack-plugin": "^5.0.14",
    "node-loader": "^1.0.1",
    "style-loader": "^1.2.1",
    "ts-loader": "^8.0.2",
    "typescript": "^4.0.2"
  },
  "dependencies": {
    "electron-squirrel-startup": "^1.0.0",
    "keytar": "^7.2.0"
  }

Answer 1

在加载本机模块时，我几乎完全复制了这个问题，唯一的区别是，在我的示例中，模块是本地构建的，并作为项目的一部分安装。

webpack对本机模块的支持在此配置中存在一些问题，并导致了这一问题。对我来说，诀窍是删除webpack中的node-loader in webpack.rules.js (删除本节)：

-  // Add support for native node modules
-  {
-    test: /\.node$/,
-    use: 'node-loader',
-  },

我找到了这个解决方案，并从电子锻造的问题跟踪器：https://github.com/electron-userland/electron-forge/issues/1688中进一步讨论了这个问题。