Quasar 框架、Electron 和 Serialport：indexOf 错误

Question

我正在使用 Quasar、Electron 和串行端口设置一个测试项目。使用最小串行端口测试启动应用程序时，出现以下错误：

vue-router.esm.js?85f8:2128 TypeError: Cannot read property 'indexOf' of undefined
    at Function.getFileName (bindings.js?d8c5:178)
    at bindings (bindings.js?d8c5:82)
    at eval (win32.js?0965:1)
    at Object../node_modules/@serialport/bindings/lib/win32.js (vendor.js:340)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at eval (index.js?3983:6)
    at Object../node_modules/@serialport/bindings/lib/index.js (vendor.js:252)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)

当我只包含串口包而不做任何事情时，甚至会发生错误。这似乎是一个基本问题。重现问题的代码：

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
import SerialPort from 'serialport';

@Component
export default class Index extends Vue {
  test() {
    console.log('test', SerialPort);
  }
}
</script>

我尝试了我能在这里找到的一切，在 Quasar 论坛等。pp.：电子重建，尝试将串行端口配置为外部依赖项，...

我不太确定重建过程是否按预期工作，但我不知道要检查什么以确保它正常工作。带有串行端口的电子示例项目正在为我工​​作。也许是类星体相关的东西？

我能否获得有关重建过程的更多信息？我尝试了不同的组合来指定版本，但没有任何帮助。

我也asked这个问题作为串行端口存储库中的一个问题，但将其添加到 vue.config.js 中不起作用，因为我使用 Quasar 作为 CLI 选项。

我认为主要问题是如何在 Quasar 到位时为电子正确重建串行端口，这似乎没有按预期工作。

Answer 1

我在让 Serialport 在 Quasar 和 Electron 中运行时也遇到了一些麻烦，但我让它工作了。解决方案不是很漂亮，将来可能会中断。

正如您所写，您需要运行 electron-rebuild。您可以通过运行“./node_modules/.bin/electron-rebuild”来执行它。您还应该将包中的 .json 放入“脚本”部分

"install": "electron-rebuild"

我使用 Electron 预加载脚本将串行端口放入窗口对象中。 Here 是有关如何启用此功能的文档。在electron-main.js中，还需要添加following line

app.allowRendererProcessReuse = false;

如果缺失，electron 将无法加载。

在electron-preload.js中，放这个

window.serialport = require("serialport");

您现在可以通过 window.serialport 在您的 Quasar 项目中使用串行端口。

我遇到的另一个问题是 Quasar 在打包项目时更改了 package.json 并删除了安装脚本，因此 electron-rebuild 在构建时不会运行，打包版本也不起作用。我设法通过在 quasar.conf.js 的电子部分添加一个“beforePackaging”Hook 来解​​决这个问题

//Top of the file
const path = require("path");
const crossSpawn = require("cross-spawn");
...
electron: {
  ...
  beforePackaging(params) {
    return new Promise(resolve => {
      const runner = crossSpawn(
        path.join("node_modules", ".bin", "electron-rebuild"),
        [""],
        {
          stdio: "inherit",
          stdout: "inherit",
          stderr: "inherit",
          cwd: params.unpackagedDir
        }
      );

      runner.on("close", () => {
        resolve();
      });
    });
  },
}

也许有人对此有更好的解决方案，但我希望这会有所帮助。

Answer 2

beforePackaging (params) {
    return new Promise(resolve => {
      const runner = crossSpawn(
        '..\\..\\..\\node_modules\\.bin\\electron-rebuild -f -v 9.3.1 -w serialport',
        [''],
        {
          stdio: 'inherit',
          stdout: 'inherit',
          stderr: 'inherit',
          cwd: params.unpackagedDir
        }
      )
      runner.on('close', () => {
        resolve()
      })
    })
  },

Answer 3

   beforePackaging(params) {
        return new Promise((resolve) => {
          const runner = crossSpawn(
           "npx electron-rebuild", [""], {
              stdio: "inherit",
              stdout: "inherit",
              stderr: "inherit",
              cwd: params.unpackagedDir,
            }
          );
          runner.on("close", () => resolve());
        });
      }