angular - Electron JS + Angular项目中的"non-JavaScript MIME type"错误

Question

我正在尝试开发 Electron JS + Angular JS桌面应用程序。我提到了this网站。

我给出的脚本是

"start:electron": "ng build --base-href ./ && electron ."

主要的 createWindow 函数就像

function createWindow () {
mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
        nodeIntegration: true
    }
});

mainWindow.loadURL(
    url.format({
        pathname: path.join(__dirname, `/dist/index.html`),
        protocol: "file:",
        slashes: true
    })
);
// Open the DevTools.
mainWindow.webContents.openDevTools();

mainWindow.on('closed', function () {
    mainWindow = null;
});
}

使用以下命令运行此命令后

npm run start:electron

我在控制台中收到以下错误。

Failed to load module script: The server responded with a non-JavaScript MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.

附上截图供引用。

 [![enter image description here][2]][2]

我怎样才能摆脱这个问题？

Ubuntu:18.04

节点js:10.16.0

Angular :v8

Answer 1

我相信我刚刚遇到了同样的问题，如果我理解正确的话，它是由 Angular 8 引入的。
This blog post关于 Angular 8 定义的新 Typescript 配置有以下说法:

When target is set to es2015, we generate and label two bundles.At runtime, the browser uses attributes on the script tag to load the right bundle.

<script type="module" src="…"> // Modern JS

<script nomodule src="…"> // Legacy JS

然而，由于某种原因，没有生成“遗留”选项；结合 Electron 5(当前版本)显然不支持 ES2015 模块的事实，这导致了您收到的消息。
为了解决这个问题，我更改了 target compilerOptions 中的设置的 tsconfig.json返回 ES5 :

{
  "compileOnSave": false,
  "compilerOptions": {
    ...
    "target": "ES5",
    ...
  },
  ...
}

我希望那里的 Angular/Typescript 专家可以告诉我们更多关于这个问题的信息。