LESS をSimpLESSでコンパイルしていますが、コンビネータの使用方法にバグがあると思われるものに遭遇しました&
。マークアップは次のとおりです。
<div class="parent">
<div class="child-1 child-2">
Hello
</div>
</div>
基本的な LESS コードは次のとおりです。
.child-1 {
color: red;
.parent & {
color: yellow;
&.child-2 {
color: blue;
}
}
}
予想される CSS 出力:
.child-1 {
color: red;
}
.parent .child-1 {
color: yellow;
}
.parent .child-1.child-2 {
color: blue;
}
SimpLESS からの実際の出力:
.child-1 {
color: red;
}
.parent .child-1 {
color: yellow;
}
.parent .child-1 .child-2 { // extra space between .child-1 and .child-2
color: blue;
}
ご覧のとおり、「Hello」が黄色か青色かの違いです。正しい LESS コンパイルはどれですか? なぜSimplESSはこれを間違えるのでしょうか?