javascript - 在 Electron 渲染进程中，我调用 Node 的 readFile 方法有什么问题？

我创建了一个最小可重现的应用程序，该应用程序基于 electron-forge 的“typescript + webpack”模板演示了我的问题。我做了一些更改以展示我的问题，你可以在这里找到整个应用程序。README 包含所有必要的重现说明（非常简单）。

基本上，我所做的是创建了一个 src/other.html 文件，我的目标是加载该文件的内容，并用新内容替换 src/index.html 中的 #main-content div 的内容。用于实现此操作的代码位于 src/renderer.ts，但问题中的代码如下：

import fs from "fs";
import path from "path";

const contentElement = document.getElementById("main-content");
const linkElement = document.getElementById("switch");

if (!contentElement) throw "Unable to find main content div.";
if (!linkElement) throw "Unable to find link element.";

linkElement?.addEventListener("click", (event) => {
  event.preventDefault();

  const href = linkElement.getAttribute("href");

  if (href) {
    const fullPath = path.join(__dirname, href);

    console.log(`Full path: ${fullPath}`);

    fs.readFile(fullPath, (err, data) => {
      if (err) throw err;

      // show the selected page
      contentElement.innerHTML = "";
      contentElement.insertAdjacentHTML("beforeend", data.toString());
    });
  }
});

它添加了一个点击处理程序，该处理程序获取 href 属性的值，并尝试使用 __dirname 构建新文件的路径，前提是这两个 HTML 文件在同一目录中。

这个代码没有按预期工作，我在开发者控制台遇到了以下错误：

Uncaught Error: Invalid package /Users/taylorthurlow/Temp/electron-problem-min-repro/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar
    at createError (electron/js2c/asar_bundle.js:5)
    at Object.e.readFile (electron/js2c/asar_bundle.js:5)
    at HTMLAnchorElement.<anonymous> (renderer.ts:50)
createError @ electron/js2c/asar_bundle.js:5
e.readFile @ electron/js2c/asar_bundle.js:5
(anonymous) @ renderer.ts:50

控制台日志调用打印出：

Full path: /Users/taylorthurlow/Temp/electron-problem-min-repro/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar/renderer/other.html

我查看了预计 electron.asar 所在的 Resources 目录，但我只看到 default_app.asar 和一些其他不相关的东西。我猜这就是我遇到错误的原因。我对 javascript/typescript 或其相关生态系统了解不多，所以不太明白这里到底发生了什么。

一些版本号：

• electron-forge v6 测试版 54
• electron 11.0.3
• node 12.20.0