asp.net-mvc - 当捆绑 EnableOptimizations 为 true 时，Font-Awesome 获取请求失败

Question

我在使用 font-awesome 和 ASP.NET 的优化/捆绑功能时遇到问题。

当 EnableOptimizations 设置为 false 时，我用于加载图像的字体效果完美:

但是，当 EnableOptimizations 设置为 true 时，不再找到该字体并显示以下内容:

我注意到 GET 请求所到达的路径之间存在差异:

EnableOptimizations = false:localhost:3620/Content/fonts/fontawesome-webfont.woff?v=4.1.0EnableOptimizations = true:localhost:3620/fonts/fontawesome-webfont.svg?v=4.1.0

有问题的包看起来像这样:

bundles.Add(new StyleBundle("~/Content/BootstrapAndFontAwesome").Include(
    "~/Content/bootstrap/bootstrapLabel.css",
    "~/Content/font-awesome/font-awesome.css"
    ));

这是怎么回事？解决这个问题的最佳方法是什么？

干杯

更新

根据 Rowan 在这篇文章的评论中的建议，我从 stackoverflow answer 实现了以下代码这已经解决了我的开发机器上的问题:

public class CssRewriteUrlTransformWrapper : IItemTransform
{
    public string Process(string includedVirtualPath, string input)
    {
        return new CssRewriteUrlTransform().Process("~" + VirtualPathUtility.ToAbsolute(includedVirtualPath), input);
    }
}

我需要进行一些实践部署以确保其可靠(例如使用虚拟 IIS 目录等)。到目前为止看起来不错!

请注意，我确实必须将 font-awesome 文件分离到它自己的 bundle 中，因为在采用 CssRewriteUrlTransform 解决方案时它无法与其他资源捆绑在一起。

谢谢。

Answer 1

使用CssRewriteUrlTransform .

Rewrites urls to be absolute so assets will still be found after bundling.

示例:

bundles.Add(new StyleBundle("~/Content/mycss")
    .Include("~/Content/font-awesome.css", new CssRewriteUrlTransform()));