捆绑CSS CDN

Question

我有一个工作地点之前，应用小型化和捆绑。我没有写原来的CSS。这个问题源于三条@import url语句被用来引入谷歌字体。

为了解决这个问题，我决定从相关的CSS文件中删除@import url，并将它们单独添加到我的BundleConfig.cs类中。

public static void RegisterBundles(BundleCollection bundles)
{
    ....
    bundles.UseCdn = true;
    var templateOriginalPath1 
        = "http://fonts.googleapis.com/css?family=Lobster";
    var templateOriginalPath2 = 
        "http://fonts.googleapis.com/css?family=Oswald:400,700,300";
    var templateOriginalPath3 
        = "http://fonts.googleapis.com/css?family
        =Ubuntu:300,400,500,700,300italic,400italic,700italic";
    ....

    bundles.Add(new StyleBundle("~/bundles/templateOriginal1",
        templateOriginalPath1));
    bundles.Add(new StyleBundle("~/bundles/templateOriginal2",
        templateOriginalPath2));
    bundles.Add(new StyleBundle("~/bundles/templateOriginal3",
        templateOriginalPath3));
}

Answer 1

显然，语法是正确的。有一个已知 错误，当显示CSS样式表时，它会导致优化框架窒息，其中包括@import url语句。

解决办法实在是太麻烦了，太不值得了。希望这对其他人有帮助。我第一次看到这个bug 这里。

您必须检查Developer工具中的响应头(我使用Firefox Developer浏览器)来查看错误的详细信息：

/* Minification failed. Returning unminified contents.
(1409,1): run-time error CSS1019: Unexpected token, found '@import'
(1409,9): run-time error CSS1019: Unexpected token, 
    found '"http://fonts.googleapis.com/css?family=Lobster"'
(1409,57): run-time error CSS1019: Unexpected token, found ';'
(1410,1): run-time error CSS1019: Unexpected token, found '@import'