无法加载 Angular 生产版本 - 由于不允许的 MIME 类型(“text/html")，加载模块被阻止 [英] Angular production build can't load - Loading module was blocked because of a disallowed MIME type (“text/html”)

问题描述

我构建了运行 ng build --configuration=production 的应用程序并将它(通过 FTP 手动)上传到服务器(我尝试了两个不同的).访问像 myurl.com 这样的根目录工作正常，但是每当我想直接访问子页面时，例如 myurl.com/subpage 页面是空白的，并且出现以下错误:从https://myurl.com/runtime-es2015.js"加载模块由于不允许的 MIME 类型(text/html")而被阻止. polyfills-es2015 也有同样的错误.js, main-es2015.js

I built my application running ng build --configuration=production and uploaded it (manually via FTP) to a server (I tried two different ones). Accessing the root like myurl.com works fine, but whenever I want to directly access a subpage, for example, myurl.com/subpage the page is blank and I get the following error: Loading module from "https://myurl.com/runtime-es2015.js" was blocked because of a disallowed MIME type ("text/html"). Same error for also for polyfills-es2015.js, main-es2015.js

如果我访问根目录并导航到子页面，一切正常.

If I access the root and navigate to the subpage everything works fine.

直到现在我尝试:

• 在 index.html 中设置

在 tsconfig.json 中设置 "target": "es5"

set "target": "es5" in tsconfig.json

手动将脚本的类型从 type="module" 更改为 type="text/javascript"像这里:<script src="runtime-es2015.js" type="text/javascript">

manually change the type of the scripts from type="module" to type="text/javascript" like here: <script src="runtime-es2015.js" type="text/javascript">

Angular CLI &Angular 版本 8.1

Angular CLI & Angular Version 8.1

打字稿版本 3.4.5

Webpack 版本 4.35.2

Webpack version 4.35.2

在服务器上，我还有一个需要的 .htaccess 文件，否则访问 myurl.com/subpage 会导致 404

On the server, I also have a .htaccess file which was needed, as otherwise accessing myurl.com/subpage resulted in a 404

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>

如果有人能帮助我，我会非常感激.

I would be really thankful, if somebody could help me.

编辑在 ng serve 期间访问子页面"工作正常！

Edit Accessing the "subpage" during ng serve works fine!

编辑 2在浏览器的开发控制台中检查网络选项卡时，.js 文件的 GET 请求工作正常，但类型错误 (html).如果我加载根页面 (myurl.com)，则 MIME 类型是正确的.

Edit2 When inspecting the Network tab in the development console on the browser, the GET requests for the .js files work fine, but the type is wrong (html). If I load the root page (myurl.com) the mime-type is correct.

推荐答案

我在部署到 https://host.my/app 的 Angular 应用程序中遇到了类似的问题.如其他SO答案中所述，更改

I had a similar problem with an Angular app I deployed to https://host.my/app. As mentioned in other SO answer changing the

到

帮我解决了.只是将其设置为 并没有.

solved it for me. Just setting it to <base href="."> did not.

HTH

这篇关于无法加载 Angular 生产版本 - 由于不允许的 MIME 类型(“text/html")，加载模块被阻止的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！