Насколько я знаю, нет способа заставить компилятор Less выдавать ошибку для недопустимого значения, как описано в вопросе. Однако вы можете сделать так, чтобы компилятор Less вообще не выдавал никаких выходных данных, когда предоставляется недопустимое значение, используя функция охраны.
В приведенном ниже фрагменте миксин вызывается только тогда, когда в качестве входных данных передается одно из двух допустимых значений. Если указано другое значение, компилятор Less не найдет совпадения и, следовательно, ничего не выведет.
.box-sizing(@value){
& when (@value=content-box) , (@value=border-box){ /* comma is the or operator */
-webkit-box-sizing: @value;
-moz-box-sizing: @value;
box-sizing: @value;
}
}
#demo{
.box-sizing(content-box);
}
В Less также есть несколько встроенных функций типов, которые можно использовать вместе с охранниками для проверки значение допустимо или нет (например, если ввод является числом или цветом и т. д.). Существует также функция iskeyword
, но ни одна из них не проверяет недопустимое значение CSS.
Если у вас есть широкий список допустимых значений, вы можете использовать функцию циклов, как показано ниже. Здесь мы извлекаем каждое значение из массива допустимых значений, и если входное значение соответствует одному из них, мы выводим свойства. Если ввод не соответствует ни одному входному значению, ничего не выводится (снова).
@valid-values: content-box, border-box, padding-box;
.box-sizing(@value){
.loop-valid-values(@index) when (@index > 0){
@valid-value: extract(@valid-values, @index);
& when (@value= @valid-value){
-webkit-box-sizing: @value;
-moz-box-sizing: @value;
box-sizing: @value;
}
.loop-valid-values(@index - 1);
}
.loop-valid-values(length(@valid-values));
}
#demo{
.box-sizing(content-box);
}
Строго не рекомендуется, но если вы настаиваете на том, чтобы компилятор генерировал то или иное исключение, когда предоставляется недопустимое значение, вы можете намеренно ввести ошибку в недопустимое-значение часть.
.box-sizing(@value){
& when (@value= content-box), (@value= border-box){
-webkit-box-sizing: @value;
-moz-box-sizing: @value;
box-sizing: @value;
}
& when not (@value= content-box), (@value= border-box){
output: @bwahahaha; /* there is no such variable and hence when the input value is not valid, compiler will complain that variable is undefined */
}
}
#demo{
.box-sizing(conten-box);
}
person
Harry
schedule
31.05.2015