捆绑 CSS CDN答案

【问题标题】：Bundling CSS CDN捆绑 CSS CDN
【发布时间】：2017-09-20 04:08:36
【问题描述】：

在应用缩小和捆绑之前，我有一个工作站点。我没有写原始的 CSS。问题源于三个 @import url 语句用于引入 Google 字体。

为了解决这个问题，我决定从相关的 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));
}

【问题讨论】：

标签： asp.net webforms bundling-and-minification

【解决方案1】：

显然，语法是正确的。有一个known bug，当出现包含@import url 语句的CSS 样式表时，它会导致优化框架阻塞。

解决方法太麻烦了，不值得。希望这对其他人有用。我看到第一次提到这个错误here。

您必须在开发者工具（我使用 Firefox 开发者浏览器）中检查响应标头以查看错误的详细信息：

/* 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'

【讨论】：