资源被解释为样式表，但使用 MIME 类型 text/javascript 传输

Question

我使用 MVC、Java Script、JQuery、Ajax 创建了一个应用程序。 当我使用 Visual Studio 进行调试时，它运行良好，没有任何脚本错误。 当我在 IIS 服务器上托管我的应用程序时，它显示控制台错误并且我的应用程序样式无法正常工作。 我附上了下面的错误。

错误：资源被解释为样式表，但使用 MIME 类型文本/javascript 传输：

图片：

Answer 1

我遇到了完全相同的问题，由以下形式的 HTML 中的行引起：

<link rel="stylesheet" type="text/css" href="css/my_css_resource.css" />

当我从标签中删除rel="stylesheet"时，问题得到了解决。

Answer 2

由于代表人数少，我无法发表评论，但这非常重要。

答案说：

“我遇到了完全相同的问题，由以下形式的 HTML 中的行引起：

<link rel="stylesheet" type="text/css" href="css/my_css_resource.css" />

当我从标签中删除 rel="stylesheet" 时，问题得到了解决。”

是非常错误的。 rel="stylesheet" 告诉浏览器这是一个 css 文件。 没有它，浏览器不知道如何处理 CSS 文件，并且其中的任何设计代码都不会被执行。

我通过从我的 html 文件中删除所有出现的 rel="stylesheet" 来确认这一点：结果是一个完全“裸”的页面，绝对没有任何设计。 我已经链接了 bootstrap css 和我自己的非空 css，并在删除 rel="stylesheet" 之前对其进行了测试，以查看样式实际上是由它们修改的。

Mime 类型由文件的发送者设置，在本例中为 Web 服务器。 错误消息表示服务器以纯文本形式发送的文件被浏览器解释为 CSS。 在这种情况下，问题出在服务器上，而不是在浏览器中。 浏览器正确地将此 CSS 文件解释为样式表。 服务器应该发送了正确的 mime 类型。

再次，我很抱歉我将此作为答案发布，即使它不是，但由于代表较低，我无法发表评论。 如果版主正在阅读此内容并希望将其删除，请将其发布为相关答案的评论，或者如果可能，将答案标记为错误，以免人们因此而受苦。

Answer 3

我意识到使用我的新 Windows 10 机器时，我无法在本地 IIS 中启用静态内容。 为此，请从控制面板转到“打开或关闭 Windows 功能”，然后导航到以下位置：

确保选中此“静态内容”选项。 然后，以管理员身份打开命令窗口并执行 iisreset。

轰，固定。

Answer 4

我遇到了同样的问题，这是由于使用错误的方法来创建包。 我不小心复制了一个脚本包代码并用 CSS 替换了它。 确保对 CSS 使用Style Bundle，对 JS 使用Script Bundle。 与渲染时相同。 样式.Render() 和脚本.Render()。

我有这个：

bundles.Add(new ScriptBundle("~/bundles/bootstrap-core-css").Include("~/Content/themes/bootstrap/css/bootstrap.min.css"));

我改为：

bundles.Add(new StyleBundle("~/bundles/bootstrap-core-css").Include("~/Content/themes/bootstrap/css/bootstrap.min.css"));

我希望这有帮助。

Answer 5

我现在遇到了同样的错误，我发现服务器上不存在 css 文件，因此，它返回了 404 页面。

所以，你需要验证css的链接。

资源被解释为样式表但使用 MIME 类型 text/javascript 传输

上面的消息可以解释为：

您请求了一个 css 文件，但我们正在向您发送一个 javascript 文件。

如果你要开始调试，我认为你应该从确保文件的来源开始。

我希望这可以帮助别人。

Answer 6

是的，我也看到了这个问题...这个问题是因为在 .htaccess 中你添加了 RewriteRule ...所以你必须更改 css 文件目录然后它会修复

Answer 7

我也遇到了 CRA 应用程序的这个问题。 我刚刚清除了我的浏览器数据，这似乎解决了这个问题。 可能是某些缓存文件导致了这种情况。

在清除浏览器数据之前，我在 edge 和 firefox 上检查了相同的构建并且它按预期工作。

错误：资源被解释为样式表，但使用 MIME 类型 text/html 传输：“https://abcxyz.com/static/css/2.0ce10a16.chunk.css”。

Answer 8

另一种可能性是，如果您的 web.config 文件中有一个小写的重写规则，类似于：

<rule name="LowerCaseRule1" stopProcessing="true">
    <match url="[A-Z]" ignoreCase="false" />
    <action type="Redirect" url="{ToLower:{URL}}" />
</rule>

如果包含这种类型的规则，则需要确保所有脚本和样式表链接都是小写的。 如果不是，您可能会看到此警告。

Answer 9

我有一个使用Docker的Angular 6项目，但遇到了这个错误。 我在这里尝试了许多明智的解决方案，但没有一个对我有用。 我以各种方式对此错误进行了研究。 根据这里的答案，我已将其添加到我的nginx.conf文件中，如下所示。

我的nginx.conf文件已更改为以下内容：

http
{
    # The line added.
    include /etc/nginx/mime.types;

    server {
        listen 80;
        listen [::]:80;
        server_name _;
        ...
    }
    ...
}

添加后，我的问题解决了，项目成功运行。 我希望这个答案能帮助那些正在寻找问题答案的人。

Answer 10

我使用反应，得到同样的错误，我通过在链接标签中删除 type="text/css" 来修复，没有错误，我验证了 css 真的被下载了。

如果删除 rel="stylesheet"，没有错误，但是 css 甚至不会下载，所以这不是解决方案，这是一个陷阱

        <link href="../src/css/gps/sidenav.css" rel="stylesheet" />