CSS 捆绑和 Internet Explorer 的限制

当我将 jquery ui 添加到包中时，我最终得到：

bundles.Add(new StyleBundle("~/Content/css").Include(
                            "~/Content/themes/base/jquery.ui.core.css",
                            "~/Content/themes/base/jquery.ui.resizable.css",
                            "~/Content/themes/base/jquery.ui.selectable.css",
                            "~/Content/themes/base/jquery.ui.accordion.css",
                            "~/Content/themes/base/jquery.ui.autocomplete.css",
                            "~/Content/themes/base/jquery.ui.button.css",
                            "~/Content/themes/base/jquery.ui.dialog.css",
                            "~/Content/themes/base/jquery.ui.slider.css",
                            "~/Content/themes/base/jquery.ui.tabs.css",
                            "~/Content/themes/base/jquery.ui.datepicker.css",
                            "~/Content/themes/base/jquery.ui.progressbar.css",
                            "~/Content/themes/base/jquery.ui.theme.css"

互联网浏览器有一个limit https://stackoverflow.com/questions/9906794/internet-explorers-css-rules-limits它将加载 31 个样式表，其中 jquery 占用了 12 个。添加 yui 重置、基础和字体 我已经有 15 个样式表，没有加载任何站点样式或插件样式表。

显然，捆绑时一切正常，因为只生成一个样式表。我的第一直觉是使用那些使用@Import的，但这会导致捆绑翻倒 https://stackoverflow.com/questions/11970293/mvc4-bundling-css-failed-unexpected-token-found-import或者不缩小。

除了减少样式表之外，最好的解决方法是什么？我当前的解决方案是#if DEBUG构造但是有更好的方法吗？

#if DEBUG
     bundles.Add(new StyleBundle("~/Content/css").Include(
                        "~/Content/themes/base/jquery.ui.all.css"));
#else
     bundles.Add(new StyleBundle("~/Content/css").Include(
                            "~/Content/themes/base/jquery.ui.core.css",
                            "~/Content/themes/base/jquery.ui.resizable.css",
                            "~/Content/themes/base/jquery.ui.selectable.css",
                            "~/Content/themes/base/jquery.ui.accordion.css",
                            "~/Content/themes/base/jquery.ui.autocomplete.css",
                            "~/Content/themes/base/jquery.ui.button.css",
                            "~/Content/themes/base/jquery.ui.dialog.css",
                            "~/Content/themes/base/jquery.ui.slider.css",
                            "~/Content/themes/base/jquery.ui.tabs.css",
                            "~/Content/themes/base/jquery.ui.datepicker.css",
                            "~/Content/themes/base/jquery.ui.progressbar.css",
                            "~/Content/themes/base/jquery.ui.theme.css"));
#endif

如果您确实需要所有主题，只需包含jquery.ui.all.css在 DEBUG 和 RELEASE 模式下。

bundles.Add(new StyleBundle("~/Content/css").Include(
    "~/Content/themes/base/jquery.ui.all.css"));

这样，在 DEBUG 模式下您将获得一个 CSS 文件，而在 RELEASE 模式下您将获得一个带有缓存标头的压缩 CSS 文件。