angular - Angular 10 - 无法加载模块脚本：服务器以“text/html”的非 JavaScript MIME 类型响应

问题描述

升级到 Angular 10 后，我在部署到 Azure 应用服务后看到：无法加载模块脚本：服务器以“text/html”的非 JavaScript MIME 类型响应。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

我的 tsconfig.base.json 看起来像这样：

    {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "module": "es2020",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es6",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

这似乎很重要：
out-tsc 似乎没有发布到服务器。在其他成功部署的应用程序中，我可以在所有页面文件中看到这种直接性。

目标 es6 产生这个：

加载模块脚本失败：服务器以“text/html”的非 JavaScript MIME 类型响应。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

<body class="mat-typography">
  <app-root>
    <span style="text-align: center;">
      Loading...
      <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
    </span>
  </app-root>
<script src="runtime-es2015.3ee9a79b8d90d488eb6e.js" type="module"></script>
<script src="runtime-es5.3ee9a79b8d90d488eb6e.js" nomodule="" defer=""></script>
<script src="polyfills-es5.a80f72600a0bfdce44d9.js" nomodule="" defer=""></script>
<script src="polyfills-es2015.92e0624093dad79ad88a.js" type="module"></script>
<script src="main-es2015.b16c8d48817baaf425be.js" type="module"></script>
<script src="main-es5.b16c8d48817baaf425be.js" nomodule="" defer=""></script>

</body>

在遵循此线程https://github.com/angular/angular/issues/30835和Angular 中的 MIME 类型问题之后，我尝试了所有这些解决方案，即使是这样：

目标 es5 产生这个：

未捕获的语法错误：意外的标记“<”

<body class="mat-typography">
  <app-root>
    <span style="text-align: center;">
      Loading...
      <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
    </span>
  </app-root>
<script src="runtime.208caafb01abdda3ac51.js" defer=""></script>
<script src="polyfills-es5.baef76646d9ddccffa84.js" nomodule="" defer=""></script>
<script src="polyfills.4ff3e861f9f5817874c8.js" defer=""></script>
<script src="main.4ad4acf8ee80919cf267.js" defer=""></script>
</body>

我不确定还能做什么？

标签： angularazure

angular - Angular 10 - 无法加载模块脚本：服务器以“text/html”的非 JavaScript MIME 类型响应

问题描述

解决方案

推荐阅读