样式表不加载在IE 9尽管MIME类型 [英] Stylesheets not loading in IE 9 despite mime type

问题描述

我有一个MVC 4应用程序使用捆绑和缩小。应用程序在IE 11，chrome和其他浏览器上工作100％正确，但使用IE9时样式表不呈现。

I have an MVC 4 application making use of bundling and minification. The application works 100% correct on IE 11, chrome and other browsers but the style sheets are not rendering when using IE9.

我添加以下到我的web.config的系统.webserver部分

I added the following to my web.config's system.webserver section

<staticContent>
  <remove fileExtension=".css"/>
  <mimeMap fileExtension=".css" mimeType="text/css"/>
</staticContent>

似乎mime类型在使用IE的开发工具时是正确的

and it seems that the mime type is correct when using IE's developer tools

>

如果mime类型是正确的，所有样式表似乎加载，为什么不会呈现？

If the mime type is correct and all stylesheets seems to load, why won't it render?

注：我也在使用Twitter Bootstrap 3和FontAwesome，不知道这是否会导致问题。

Side Note: I'm also using Twitter Bootstrap 3 and FontAwesome, not sure if this is causing problems.

UPDATE：

当我使用fiddler时，我可以看到mime类型仍然设置为text / css; charset = utf-8

When I use fiddler I can see that the mime type is still set to text/css; charset=utf-8

推荐答案

好的，最终发现了问题。这不是mime类型的问题，我希望这将节省一个人几个小时。 IE9将css文件的大小限制为大约250kb，因为我使用捆绑和缩小我的css软件包之一超过了这个限制，并且文件被截断，导致一些样式未被应用。

Ok, eventually found the problem. This was not a problem with the mime type and I hope this will save someone a few hours. IE9 limits the size of css files to about 250kb, because I'm using bundling and minification one of my css bundles were exceeding this limit and the file was truncated, resulting in some of the styles not being applied.

修复是相当容易，我把我的CSS包分成两个包，例如

The fix was rather easy, I split my css bundle into two bundles, for example

 bundles.Add(new StyleBundle("~/Bundles/Shared/CSS").Include(
            "~/Content/bootstrap/bootstrap.min.css",
            "~/Content/font-awesome.min.css",
            "~/Content/silviomoreto-bootstrap-select/bootstrap-select.min.css",
            "~/Content/kendo/kendo.common.min.css"));

  bundles.Add(new StyleBundle("~/Bundles/SharedTwo/CSS").Include(
            "~/Content/datepicker/css/datepicker.css",
            "~/Content/kendo/kendo.bootstrap.min.css",
            "~/Content/bootstrap-touchspin-master/libraries/prettify/prettify.css",
            "~/Content/bootstrap-touchspin-master/libraries/prettify/demo.css",
            "~/Content/css/Shared/Index.css"));

这篇关于样式表不加载在IE 9尽管MIME类型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！