12

在一个简单的 ASP.Net MVC4 测试应用程序中,我安装了无点 NuGet 包并按照本教程进行操作。

我的.less文件被正确解析为 CSS 并且在debug=true.

<link href="/Public/less/main.less" rel="stylesheet"/>
<link href="/Public/less/home.less" rel="stylesheet"/>
<link href="/Public/less/a.less" rel="stylesheet"/>
<link href="/Public/less/b.less" rel="stylesheet"/>
<link href="/Public/less/c.less" rel="stylesheet"/>

但是,当我设置debug=false它以使其缩小并合并为单个样式表时,我得到了这个:

<link href="/Public/less?v=" rel="stylesheet"/> // NOT WORKING!

这是我的捆绑配置文件;再次,直接取自教程:

public class BundleConfig
{
    // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
    public static void RegisterBundles(BundleCollection bundles)
    {

        // Compile .less files and create a bundle for them.
        var lessBundle = new Bundle("~/Public/less").Include(
                                                        "~/Public/less/main.less",
                                                        "~/Public/less/home.less",
                                                        "~/Public/less/a.less",
                                                        "~/Public/less/b.less",
                                                        "~/Public/less/c.less");
        lessBundle.Transforms.Add(new LessTransform());
        lessBundle.Transforms.Add(new CssMinify());
        bundles.Add(lessBundle);
    }
}

在我的布局文件中:

<head>
    @Styles.Render("~/Public/less")
</head>

这是我的 LessTransform 类:

public class LessTransform : IBundleTransform
{
    public void Process(BundleContext context, BundleResponse response)
    {
        response.Content = dotless.Core.Less.Parse(response.Content);
        response.ContentType = "text/css";
    }
}

关于为什么捆绑包无法正常工作的任何想法debug=false

4

4 回答 4

11

默认情况下,MVC 4.0 中的捆绑和缩小在调试模式下是禁用的,因为缩小和捆绑使调试变得非常困难,甚至有时是不可能的。LessTransform.Process您可以通过在方法上设置断点来测试它。仅在项目使用orLessTransform.Process运行时调用。debug = falseBundleTable.EnableOptimizations = true

<link href="/Public/less?v=" rel="stylesheet"/>意味着捆绑的结果是空的。

请确保至少有一个 less 文件生成 CSS 内容,如果是,请检查LessTransform它必须是的类:

public class LessTransform : IBundleTransform
{
    void IBundleTransform.Process(BundleContext context, BundleResponse response)
    {
        response.Content = Less.Parse(response.Content);
        response.ContentType = "text/css";
    }
}

通过放入BundleTable.EnableOptimizations = true;RegisterBundles 方法,您可以在调试模式下覆盖优化机制(捆绑和缩小)的默认设置,然后您可以调试并检查结果Less.Parse(response.Content);

于 2013-03-29T12:55:50.057 回答
3

.less该问题是编译into时出现的静默错误css


我使用断点检查LessTransform使用dotless库编译的类。

public class LessTransform : IBundleTransform
{
    public void Process(BundleContext context, BundleResponse response)
    {
        response.Content = Less.Parse(response.Content); // Breakpoint here.
        response.ContentType = "text/css";
    }
}

我注意到当悬停在response.Content我可以看到我的less代码时,但在Less.Parse代码之后,response.Content会变成空的。

less通过检查器运行了我的代码,并注意到我的代码中有语法错误。

修复错误后,捆绑和缩小按预期正常工作。

于 2013-03-30T23:25:51.663 回答
0

除非我误解了你所说的没有意义。

当你有debug = true它看起来你的样式表没有被捆绑,因为它们被单独引用,因此没有被缩小/捆绑到一个文件中,当 debug 设置为 true 时这是预期的,这样你就可以轻松地调试你的脚本/样式而无需不得不涉足缩小和捆绑的代码。

当您拥有debug = false它时,会出现缩小/捆绑,因为您只获得两个网址。

看起来很奇怪的一件事是,较少的 url 没有与之关联的哈希,即。v= 是空白的,这可能需要研究。

您也可以尝试<localaddress>/Public/less?v=在浏览器中加载 url,如果它在缩小/捆绑时遇到问题,它通常会在文件顶部给您一个警告,看看它会返回什么。

于 2013-03-25T00:31:47.920 回答
0

看起来你有更少的空文件。所以没有生成哈希是正常的。

只是让你知道。您不需要使用 bundle 来获取更少的文件。您可以使用 import 关键字 insinde less 来组合文件。@import "a.less";

于 2013-03-28T08:34:06.083 回答