时间戳

首页 > 解决方案 > 电子 JS + Angular 项目中的“非 JavaScript MIME 类型”错误

angular - 电子 JS + Angular 项目中的“非 JavaScript MIME 类型”错误

问题描述

我正在尝试开发Electron JS + Angular JS桌面应用程序。我参考了这个网站。

我给出的脚本是

"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

角度：v8

标签： angularelectronmime-types

解决方案

我相信我刚刚遇到了同样的问题，如果我理解正确的话，它是由 Angular 8 引入的。

这篇博文对 Angular 8 定义的新 Typescript 配置有以下看法：

当目标设置为 es2015 时，我们生成并标记两个包。在运行时，浏览器使用脚本标签上的属性来加载正确的包。

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

<script nomodule src="…&quot;> // Legacy JS

然而，由于某种原因，没有生成“遗留”选项；结合 Electron 5（当前版本）显然不支持 ES2015 模块的事实，这导致了您收到的消息。

为了解决这个问题，我将后面的target设置更改compilerOptions为：tsconfig.jsonES5

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

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

推荐阅读