2013-06-18 1 views
0

Я компилирую свой LESS с помощью SimpLESS, но работаю с тем, что, по моему мнению, является ошибкой с использованием комбинатора &. Вот разметка:Вложенные амперсанды в SimpLESS

<div class="parent"> 
    <div class="child-1 child-2"> 
    Hello 
    </div> 
</div> 

И основной МЕНЬШЕ код:

.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; 
} 

Как вы можете видите, это разница между «Хеллом» lo "желтого или синего. Какая правильная компиляция LESS? Почему SimpLESS ошибся?

ответ

1

Правильный выход

.child-1 { 
    color: red; 
} 
.parent .child-1 { 
    color: yellow; 
} 
.parent .child-1.child-2 { 
    color: blue; 
} 

Таким образом, вы правы, что вы ожидаете. Вы можете дважды проверить, если вы посетили http://less2css.org/, это сайт, который был связан в разделе «Попробуйте прямо сейчас» на http://lesscss.org/.

Итак, вы, вероятно, обнаружили ошибку в парсе SimpLESS.