меньше компилятор удваивает все - PullRequest
8 голосов
/ 23 марта 2012

В моем проекте очень простой файл style.less, и я использую bootstrap для чистого, отзывчивого дизайна. Итак, поехали:

@import "bootstrap/bootstrap.less";

@import "../css/jquery.vegas.css";
@import "../css/jquery.fancybox-1.3.4.css";

body {
  padding-top: 60px;
  padding-bottom: 40px;
}

@import "bootstrap/responsive.less";

Теперь, когда я компилирую файл с помощью less, вывод css выглядит странно:

.container {
  width: 940px;
  margin-left: auto;
  margin-right: auto;
  *zoom: 1;
  *zoom: 1;
  width: 940px;
  margin-left: auto;
  margin-right: auto;
  *zoom: 1;
  *zoom: 1;
}

Он просто удваивает все! Я могу видеть это странное поведение даже в браузере, когда я работаю над своим экземпляром devolper.

Это так странно и ужасно, у кого-нибудь есть идея, почему это происходит? В исходных файлах less, импортированных из начальной загрузки, все определяется только один раз.

Ответы [ 2 ]

6 голосов
/ 03 апреля 2012

Вот два возможных решения. Они оба кажутся очевидными, но я иногда пропускал ОБА из них ...

  1. Видите ли вы дублирующиеся правила стиля в фактическом скомпилированном файле CSS? ИЛИ вы видите дублирующие правила в инструментах разработчика Firebug или Chrome? Если это второе, вернитесь и убедитесь, что в вашем CSS-файле действительно есть дубликаты.

  2. У меня была точно такая же проблема дублирования при использовании LESS, и я не мог понять это, пока не понял, что дважды включил css в <head>. Это глупая ошибка, но я определенно делал это раньше.

Удачи.

0 голосов
/ 16 апреля 2014

Убедитесь, что вы используете последнюю версию LESS.

Поведение по умолчанию @import раньше не было очень умным, если его вызывали несколько раз из разных файлов.

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

Однако теперь они сделали поведение @import-once по умолчанию, даже если вы просто используете @import.

См. Также: для чего нужен оператор LESS CSS @ import-Once?

...