合并并扩展不同LESS文件中的CSS选择器（引导）

在

base.less中

：

html{font-size:16px}
body{color:green}

html{color:red}

@import "base.less"
@import "theme.less"

在

theme.less中

：

html{font-size:16px}
body{color:green}

html{color:red}

@import "base.less"
@import "theme.less"

在

main.less

中：

html{font-size:16px}
body{color:green}

html{color:red}

@import "base.less"
@import "theme.less"

在编译时，它输出：

html{font-size:16px}
body{color:green}
html{color:red}

我如何输出这个

html{font-size:16px;color:red;}
body{color:green}

我在

主题中尝试了这一点。但没有成功：

html:extend(html) { color:red }

我是否需要使用CSS优化器，还是可以少用一些？
手动方式
我发现。我尝试了你的代码，它输出了你想要的。不过，这是一个外部工具。你必须手工做


咕噜声
让他来处理这件事。检查该页面的文档

如果您使用的是Grunt，您可以添加允许您在运行
Grunt watch
时只需保存LESS即可将LESS编译为CSS（无冗余）。我想这正是您想要的。
可以通过mixin强制“整合”选择器样式：

html{.html（）}
.html（）{font size:16px}
主体{颜色：绿色}
.html（）{color:red}
.html（）{背景色：蓝色}
//等等。

虽然这种主题化通常是通过变量实现的：

// base.less

@text-color: blue;

html {
    font-size: 16px;
    color:     @text-color;
}

// theme.less:

@text-color: yellow;

编译更少的代码（我使用gulp）没有问题，但是单独编译并不能合并选择器。你发布的链接有点“有效”，但我当然需要自动完成，最好使用更少的链接。@David我理解。对我来说，用咕噜声/咕噜声的方式更方便。保存->工作完成。使用更少的资源对您有什么好处？让我理解，这样也许我能更好地帮助你。为什么？这似乎是一种未成熟的优化。节省8/10/30个字符真的值得这么多吗，特别是如果你将它们作为编译的CSS提供，它们将被缓存在客户端？@legostrmtropr这不是优化的问题。考虑这一点：<代码> .Cave:Re}} Cb{颜色：Green }。CA {颜色：黄色} <代码> YOLO 。这正是不合并（<代码> CA >代码>类）选择器的原因。这类东西是没有理由的，但恐怕短期内不会实施。不过，有一种方法可以通过mixin来模拟这种行为。在这种情况下，您的样式规则包含冲突的信息，您需要的是开发人员问题的技术解决方案。哪条规则将保持红色或黄色？SASS和LESS被设计为CSS的改进类型，以减少CSS的冗长，从而更难犯这些错误。像这样的冲突应该在测试和代码审查中解决，而不是在编译器中解决。@Legostrmtroopr示例并非无效，CSS使用简单的规则计算其级联。该示例将是黄色的，因为它是在红色之后定义的。这就是我需要以某种方式控制它的原因。但这需要我编辑
base.less
文件，对吗？是的。如果你不能修改“base.less”，那么在纯less中是不可能的。好吧，我“可以”做到，但这是从bootstrap core来的，所以我不希望修改源代码，就像你在添加插件时不修改jquery core一样。但是谢谢你的洞察力。在Bootstrap的情况下，我想知道你需要破解的确切样式是什么（因为在Bootstrap中，这些东西通常是通过变量控制的，例如，不设置
html
color，而只需覆盖
@text color
body

的变量）。但一般来说，是的，如果某些样式不打算在库中进行自定义，那么我们只能通过级联来覆盖它（这是预期的，因为较少的样式是为创建样式表而设计的，而不是为了攻击现有样式表：）