为什么使用 MVC4 StyleBundles 时我的图像会损坏？

MVC4 StyleBundle 解决图像问题

使用 MVC 的 StyleBundle 在子文件夹中组合 CSS 文件和外部图像引用时会出现问题。使用与物理内容路径不对应的虚拟路径定义包时，CSS 文件内的相对图像路径会被破坏。

解决方案

正确的方法就是在与要组合的源文件相同的路径上定义包。例如：

bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle")
                    .Include("~/Content/css/jquery-ui/*.css"));

通过在与源 CSS 文件相同的路径上定义包，相对图像路径仍然有效。这是因为捆绑路径的最后一部分实际上充当捆绑的 CSS 文件的文件名。

替代解决方案

根据Hao Kung 的建议，另一种方法是使用 CssRewriteUrlTransformation 重写捆绑 CSS 中的图像引用文件：

bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle")
                    .Include("~/Content/css/jquery-ui/*.css",
                     new CssRewriteUrlTransform()));

此转换将自动修改相对图像路径，以确保它们在捆绑后指向正确的位置。

注意

当使用 CssRewriteUrlTransformation，了解在虚拟目录中重写绝对路径的潜在问题非常重要。此行为可能并不适合所有场景。

以上是为什么使用 MVC4 StyleBundles 时我的图像会损坏？的详细内容。更多信息请关注PHP中文网其他相关文章！