reactjs - 电子和反应：找不到具有给定 URL 的资源，DevTools 无法加载 SourceMap

Question

对于我的电子应用程序的生产（mac dmg）构建，我无法触发location.reload()、连接到redux-dev-tools，并且源映射无法加载。

加载应用程序时，控制台会警告它无法加载源映射：

来源中的index.html说资源无法加载：

执行location.reload()会导致应用程序崩溃并出现白屏并且没有控制台日志（此命令在电子开发版本中有效）。

我的电子代码包含在electron/index.electron.js其中，相关的片段是：

const options = {
    icon: join(__dirname, '../src/common/assets/app-icons/png/256x256.png'),
    webPreferences: {
        nodeIntegration: false,
        preload: join(__dirname, "preload.js")
    }
};
// ...
mainWindow = new BrowserWindow({
  ...options,
  ...windowOptions
});
// ...    
const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://../build/index.html"
});
// ...
mainWindow.loadURL(startUrl);

相关package.json片段：

"homepage": "./",
"scripts": {
  "electron-build:mac": "rm -rf dist/ && yarn build && electron-builder -m",
},
"build": {
    "appId": "appId",
    "extends": null,
    "files": [
      "dist/**/*",
      "build/**/*",
      "node_modules/**/*",
      "src/common/assets/**/*",
      "public/*",
      "electron/**/*"
    ],
    "directories": {
      "buildResources": "./src/common/assets"
    }
  },
"devDependencies": {
  "electron": "^11.3.0",
  "electron-builder": "^22.9.1"

我唯一可以在 dev 中确认的是运行location.reload()成功会重新加载应用程序。

谢谢 ：）

标签： reactjselectronelectron-builderreact-scripts

Answer 1

你的网址无效，你应该改变这个：

const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://../build/index.html"
});

对此

const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://${ __dirname}/build/index.html"
});