首页 > 解决方案 > 升级到 bootstrap 4 CSS minifier 在 asp.net mvc 中中断

问题描述

这些是我产生此错误所遵循的步骤

检查 VS 2017 是最新的

VS版

创建了一个新的 asp.net web 应用程序,选择了 MVC 和 F5 来调试应用程序而不做任何更改。我看到没有捆绑或缩小的不同 CSS 文件。

通过更改 debug = false 在 web.config 中进行更改以缩小和捆绑

<compilation debug="false" targetFramework="4.6.1"/>

F5 -> 查看站点,我看到一个内容被缩小的 CSS 文件。

停止调试

从 VS -> 工具 -> NuGet 包管理器 -> 管理 NuGet 包以获取解决方案。

我看到了 14 个更新,其中之一是我们想要在项目中使用的 bootstrap v4。更新所有包

包更新后 F5 不调试

查看源代码->css文件被捆绑到一个文件中->查看css文件会出现错误

/* Minification failed. Returning unminified contents.
(6,10): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,25): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,42): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,59): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,74): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,88): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,105): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,122): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,138): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,153): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,168): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,181): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,196): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,216): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,234): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,254): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,272): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,287): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,305): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,322): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,338): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,353): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,371): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,393): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,415): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,437): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,460): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,644): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */

根据这篇文章,BundlerMinifier 中解决了这个问题,但我没有那个包或 Nuglify,而且缩小和捆绑似乎仍然在发生。

开箱即用而不做任何更改应该是直截了当的,但事实并非如此。

我在这里想念什么?

标签: asp.net-mvc

解决方案


这是一个内置的 C# 问题。他们使用他们的类来压缩css。我找到了问题的解决方案。您必须创建自己的课程

public class MyStyleBundle : Bundle
{
    public MyStyleBundle(string virtualPath) : base(virtualPath, new MyCssMinify())
    {
    }

    public MyStyleBundle(string virtualPath, string cdnPath) : base(virtualPath, cdnPath, new MyCssMinify())
    {
    }
}

public class MyCssMinify : IBundleTransform
{
    internal static readonly MyCssMinify Instance = new MyCssMinify();

    internal static string CssContentType = "text/css";


    public virtual void Process(BundleContext context, BundleResponse response)
    {
        if (context == null)
        {
            throw new ArgumentNullException("context");
        }
        if (response == null)
        {
            throw new ArgumentNullException("response");
        }
        if (!context.EnableInstrumentation)
        {
            // CssCompress.Go- This is your CSS compression implementation
            // You can use the library " Uglify"
            response.Content = CssCompress.Go(response.Content);
        }
        response.ContentType = CssContentType;
    }
}

现在您可以添加一个新的 Bundle

    bundles.Add(new MyStyleBundle("~/Content/css").Include(
              "~/Content/bootstrap.css",
              "~/Content/site.css"));

推荐阅读