angular - Angular 9 + NGINX - 加载子路由的问题（返回 MimeType 错误）

Question

所以我遇到了 MimeType 的问题。我的 .js 文件正在返回我的 index.html 文件，因为找不到它们。我意识到 .js 文件的 URL 正试图从 domain/route/route2/bundledjsfile.js 提供，但是当我访问它时，就像我说的它返回 HTML 而不是 JS。但是，在地址栏中更改路由后，我注意到 d domain/route/bundledjsfile.js 返回了实际的缩小 js。

Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
06:12:19.128 polyfills-es2015.3fd94ed6a324eee92aec.js:1 Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
06:12:19.128 main-es2015.0b1d748ffcf78a2a0b26.js:1 Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

这只发生在我有一个尝试渲染组件的子路由时

const routes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] },
{ path: 'dashboard/guilds', component: GuildsComponent, canActivate: [AuthGuard] }];

我不确定如何解决这个问题，因为我的服务器块位置设置如下：

location /intellectual {
    alias /var/www/intellectual-developers/intellectual/;
    try_files $uri $args $uri$args/ $uri/ /intellectual/index.html;
  }

location /api/intellectual {
    rewrite ^\/api\/intellectual\/(\w+)$ /api/intellectual/$1 break;
    proxy_pass http://localhost:9001;
}

/intellectual 是正在服务的 Angular 应用程序。这个问题也只发生在我访问我的应用程序的主要路由时，例如，我的 NGINX 提供的基本 url 是 /intellectual，而 Angular 路由是 /guild、/dashboard 等，这些都可以正常工作，因为 JS/CSS 文件返回正确。但是，如果我尝试访问子路由，例如 /intellectual/guild/my-guild 或 /intellectual/dashboard/my-dashboard，它将引发错误。所以我不知道该怎么做才能解决这个问题。我知道这是一个路径问题。

标签： angularnginx