渲染样式捆绑包与样式链接不同答案

【问题标题】：Rendering style bundles bundles not the same as style links渲染样式捆绑包与样式链接不同
【发布时间】：2014-11-29 14:58:31
【问题描述】：

我有一个 ASP.NET MVC 应用程序，该应用程序使用了来自 crazythemes 的 Metronic 模板。

当我在我的 css 布局中使用包时，它不能正常工作。大多数图标没有出现

如果我切换到直接链接，那么一切正常。

Javascript 没问题。

捆绑配置和布局使用：

bundles.Add(new StyleBundle("~/bundles/metronic-app").Include(
    "~/assets/global/plugins/font-awesome/css/font-awesome.min.css",
    "~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css",
    "~/assets/global/plugins/uniform/css/uniform.default.css",
    "~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css",
    "~/assets/global/css/components.css",
    "~/assets/global/css/plugins.css",
    "~/assets/admin/layout2/css/layout.css",
    "~/assets/admin/layout2/css/themes/default.css",
    "~/assets/admin/layout2/css/custom.css"));


@Styles.Render("~/bundles/metronic-app")

直接链接：

<link href="~/assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css">
<link href="~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN THEME STYLES -->
<link href="~/assets/global/css/components.css" rel="stylesheet" type="text/css" />
<link href="~/assets/global/css/plugins.css" rel="stylesheet" type="text/css" />
<link href="~/assets/admin/layout2/css/layout.css" rel="stylesheet" type="text/css" />
<link id="style_color" href="~/assets/admin/layout2/css/themes/default.css" rel="stylesheet" type="text/css" />
<link href="~/assets/admin/layout2/css/custom.css" rel="stylesheet" type="text/css" />

以下是来自 chrome 控制台的错误：

【问题讨论】：

标签： css asp.net-mvc layout

【解决方案1】：

我应该在我的包配置中使用CssrewriteUrlTransform 类，以使资产的路径成为绝对路径。

这是有效的：

bundles.Add(new StyleBundle("~/bundles/metronic-app").Include(
                "~/assets/global/plugins/uniform/css/uniform.default.css",
                "~/assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css",
                "~/assets/global/css/components.css",
                "~/assets/global/css/plugins.css",
                "~/assets/admin/layout2/css/custom.css")
                .Include("~/assets/admin/layout2/css/layout.css", new CssRewriteUrlTransform())
                .Include("~/assets/admin/layout2/css/themes/default.css", new CssRewriteUrlTransform())
                .Include("~/assets/global/plugins/font-awesome/css/font-awesome.min.css", new CssRewriteUrlTransform())
                .Include("~/assets/global/plugins/simple-line-icons/simple-line-icons.min.css",new CssRewriteUrlTransform()));

来自SO Question的提示

【讨论】：