如何为 Angular CLI 生成的块设置 MIME 类型?



在我的 Angular 应用程序中,我使用延迟加载在特定路由上为模块提供服务。当我构建我的应用程序时,它会在 dist 文件夹中生成块。

当我尝试在浏览器中加载我的应用程序时,它会抛出错误: "拒绝执行来自'0.chunk.js'的脚本,因为它的MIME类型('text/html'(不可执行,并且启用了严格的MIME类型检查。

无论如何,我可以在生成文件时添加 MIME 类型或禁用 MIME 类型检查吗?

我有一个基本的路由文件,其中包含:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const appRoutes: Routes = [
{
path: '',
redirectTo: 'app',
pathMatch: 'full'
},
{
path: ‘new’,
loadChildren: 'app/base/new/new.module#NewModule'
}
];
@NgModule({
imports: [
RouterModule.forRoot(appRoutes),
],
})
export class AppRoutingModule {
}

我在 package.json 中使用以下命令构建我的应用程序:

"build": "rm -rf dist && ng build --prod --output-hashing none --build-optimizer",

在 dist 文件夹中,它生成:

chunk {0} 0.chunk.js () 2.54 kB  [rendered]
chunk {1} 1.chunk.js () 262 kB  [rendered]
chunk {2} main.bundle.js (main) 942 kB [initial] [rendered]
chunk {3} polyfills.bundle.js (polyfills) 94.9 kB [initial] [rendered]
chunk {4} styles.bundle.css (styles) 50.5 kB [initial] [rendered]
chunk {5} inline.bundle.js (inline) 1.36 kB [entry] [rendered]

虽然我在 Firefox 中遇到了同样的错误,但 Chrome 给了我更多的见解,在打开指向延迟加载模块的路由时,我向我展示了所有捆绑包的 404s。我认为更改index.html中的基本 href 解决了这个问题。

我把<base href=".">改成了<base href="/">,事情开始好转了。

我没有找到为块设置mime类型的方法,但我确实发现删除延迟加载还可以确保不会创建块,从而解决了我的问题。

按照本指南删除延迟加载: https://www.concretepage.com/angular-2/angular-module-loading-eager-lazy-and-preloading

最新更新