ChunkLoadError: 加载块 # 失败。electron-react-boilerplate

Question

在运行yarn package并打开应用程序后，当我的应用程序尝试显示使用React.Lazy的组件时，我会遇到这个错误。

// this Is how I declare my component
const LazyAcaoPage = React.lazy(() => import(
/* webpackChunkName: "AcaoPage" */ './containers/acao/AcaoPage') );

const AcaoPage = (props: Record<string, any>) => (
  <React.Suspense fallback={<h1>Loading...</h1>}>
    <LazyAcaoPage {...props} />
  </React.Suspense>
);

// then call it
<Route path={routes.ACAO} exact component={AcaoPage} />

package.json 构建选项

"build": {
    "productName": "MyProject",
    "appId": "org.erb.ElectronReact",
    "files": [
      "dist/",
      "node_modules/",
      "index.html",
      "main.prod.js",
      "main.prod.js.map",
      "package.json"
    ],

webpack的输出选项

 output: {
    path: path.join(__dirname, '../../src/dist'),
    publicPath: './dist/',
    filename: 'renderer.prod.js',
  },

这些块文件已正确构建并保存在 screen/dist 文件夹中，但生产代码似乎无法找到它。我实际上解压了生成的Mac应用程序中的 app.asar 并且这些文件也在里面。

我正在运行于Mac上的Node版本14.4.0，并且升级我的代码从之前的样板模板版本。以前它可以正常工作。

如果有任何指导，我会非常感激。谢谢

- Hozeis

---

你找到任何解决方法了吗？ - Amir Alam

@AmirAlam 我已经很久没有在那个项目上工作了，也不记得我是否参与过。抱歉。我相信我没有参与。 - Hozeis

@AmirAlam，有人发布了一个答案，请检查它是否适用于您。 - Hozeis

我发布了那个答案，对我来说它有效。谢谢你的回复。如果您将其标记为答案，那就太好了。 - Amir Alam

Answer 1

我也遇到过这个问题，原因是在 main.js 中初始化了 createWindow 两次。

另一种情况是由于 VS Code 调试器没有正确关闭，导致 electron exe 在任务管理器中仍在运行，只需结束该进程即可解决问题。

- Amir Alam