Lesscss Mixins с охраной.Ошибка синтаксиса - PullRequest
Новая
       25

Lesscss Mixins с охраной.Ошибка синтаксиса

1 голос
/ 09 марта 2012

Я пишу свой CSS с Lesscss, используя его на стороне клиента (с компилятором less.js).

В документации есть хорошие примеры использования охранников, но у меня это не работает. Я не могу понять, почему ...

Пример кода приведен здесь: 

@import "common-functions.less";

// variables
@minHeaderWidth: auto;
@maxHeaderWidth: 1200px;

@minButtonsWidth: 50px;
@maxButtonsWidth: 75px;

// Mixins with guards
.applyHeaderStyles(@headerWidth, @buttonsWidth) when (ispixel(@headerWidth)) {
    .my-headerElement {
        width: @headerWidth;
    }
}
.applyHeaderStyles(@headerWidth, @buttonsWidth) when not (ispixel(@headerWidth)) {
    .my-headerElement {
        width: @headerWidth;
        margin: 0 @buttonsWidth;
    }
}

// than I use .applyHeaderWidth in @media queries
@media screen and (min-width: 1050px) {
    .applyHeaderStyles(@maxHeaderWidth, @maxButtonsWidth);
    .my-buttonElement {width: @maxButtonsWidth;}
}
@media screen and (max-width: 1049px) {
    .applyHeaderStyles(@minHeaderWidth, @minButtonsWidth);
    .my-buttonElement {width: @minButtonsWidth;}
}

Код был написан документацией. Но это не работает. Когда я выполняю этот код, у меня появляется синтаксическая ошибка: 

Syntax Error on line 10
[link to my file] on line 10, column 58:
10    // Mixins with guards
11    .applyHeaderStyles(@headerWidth, @buttonsWidth) when <b>(ispixel(@headerWidth)) {</b>
12        .my-headerElement {

1 Ответ

1 голос
/ 20 марта 2012

Как уже упоминалось здесь , обновление до less.js 1.2.2 решает проблему.

Из журнала изменений : 

1.2.0
Mixin guards
...