MVC4捆绑误导背景图像网址

Posted 2023-03-06

【中文标题】MVC4捆绑误导背景图像网址

【英文标题】：MVC4 Bundling misdirect background-image url

【发布时间】：2013-09-03 01:36:47

【问题描述】：

我有这个捆绑配置：

bundles.Add(new StyleBundle("~/styles/style1").Include("~/Content/library/styles/style1.css")

然后我添加了这段代码来渲染捆绑的 CSS：

@Styles.Render("~/styles/style1")

我的 CSS 有这个内容：

.style1 
  background-image: url("../img/image.png");

由于捆绑，背景图像的路径被错误定向到 ~/Content/library/img/image.png 而不是 ~/img/image.png。我不想编辑 CSS 文件路径，因为许多其他页面正在使用它。你知道它的任何解决方案还是我在捆绑时缺少配置？

【问题讨论】：

~/Content/styles/style1 style1 是你的css文件吗？那么你应该这样使用它~/Content/styles/style1.css

@xurca 现在编辑了我的问题，但我希望你能得到我的问题，主要概念是捆绑会误导 url 路径

我可以建议你检查这个链接：***.com/questions/11355935/…

【参考方案1】：

您需要申请 CssRewriteUrlTransform 来解决此问题：

bundles.Add(new StyleBundle("~/styles/style1")
                .Include("~/Content/styles/style1", new CssRewriteUrlTransform())

或者，您也可以在样式表中使用绝对路径。

PS：如 cmets 所述，您必须通过 Codeplex 或 NuGet 将 Web Optimization Package 添加到您的项目中，才能使用 CssRewriteUrlTransform 类 p>

【讨论】：

是VS2012内置的CssRewriteUrlTransform类吗？

尝试添加对System.Web.Optimization的引用。如果找不到，请看这里：aspnetoptimization.codeplex.com

或者，或者，使用 NuGet：Install-Package Microsoft.AspNet.Web.Optimization

当心 CssRewriteUrlTransform 的问题，例如数据 url 和虚拟目录，并考虑使用 CssRewriteUrlTransformFixed.cs。