@ Импорт меньшего количества файлов в ограниченную область - PullRequest
Новая
       3

@ Импорт меньшего количества файлов в ограниченную область

22 голосов
/ 08 марта 2012

Я хочу импортировать все стили из другого файла меньшего размера, но в ограниченном объеме. Я пытаюсь это:

"мой-site.less" 

.wrapper-class {
    @import "path/to/styles.less";
}

Но это совсем не работает. Я использую браузерную опцию less.js и вижу оператор GET, который выполняется, когда он фактически выполняет импорт. Но полученный CSS не содержит ни одного из стилей из другого листа. Если я делаю это так, это работает: 

.wrapper-class 
{
    /* ... */
}
@import "path/to/styles.less";

Но это побеждает первоначальную цель. Так есть ли способ сделать @import с ограниченной областью действия таким же образом в Less? Спасибо!

Ответы [ 3 ]

44 голосов
/ 08 марта 2014

Поскольку этот вопрос был опубликован и получен ответ, препроцессоры реализовали @import с областью действия. Теперь это работает в LESS, SASS и Stylus.

пример: 

.lt-ie9 {
  @import "ie8-fixes";
}
1 голос
/ 08 марта 2012

Согласно css-spec , объявление @import должно предшествовать всем остальным объявлениям в css-файле. Таким образом, ваш @import внутри правила, как ожидается, потерпит неудачу. Полагаю, что @import в конце файла не вызывает ошибок - это доброжелательность производителей браузеров.

Полагаю, LESS будет соблюдать те же правила.

EDIT: вопрос в том, почему вы хотите, чтобы эти стили были ограничены? При правильных декларациях в этом нет необходимости.

0 голосов
/ 11 марта 2012

Синтаксис LESS (и CSS) не допускает @imports в правилах CSS.Попробуйте использовать пространство имен :

styles.less 

.styles {
    [your code]
}

Затем замените @import для пространство имен : 

.wrapper-class {
    .styles;
}

Ссылка:

http://lesscss.org/features/

...