將網站部署到應用程序時的mvc捆綁和相對css映像

Question

要將相對圖像路徑轉換為絕對路徑，有很多問題需要在stackoverflow中提出並回答，如下所示：

MVC4 StyleBundle無法解析圖像

建議添加new CssRewriteUrlTransform()如下：

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

這實際上已經救過我了。 但是現在我將我的網站部署到應用程序（不是網站的根目錄），仍然存在一個問題：

申請是：

http://localhost/sample/

但圖片網址如下：

http://localhost/css/imgs/spirit.png

雖然它應該是：

 http://localhost/sample/css/imgs/spirit.png

雖然捆綁的CSS鏈接本身是正確和有效的。

Answer 1

如果沒有涉及虛擬目錄，則以下代碼將執行：

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

但是當使用VirtualDirectory時，CssRewriteUrlTransform將重寫為Host而不是Host / VirtualDirectory。 解決方案是派生CssRewriteUrlTransform，這里將對此進行全面討論： ASP.NET MVC4與Twitter Bootstrap捆綁 ：

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

Answer 2

這實際上只是另一個問題，當應用程序作為虛擬目錄運行時，優化通常無法正常工作。

由於您使用虛擬目錄來托管您的網站，因此您應該創建一個使用固定路徑調用CssRewriteUrlTransform的包裝器：

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

更多信息