Автоматически генерировать основной CSS при сохранении импортированного LESS

Я использую Dotless в своем проекте ASP.NET MVC, у меня есть основной файл less, который просто импортирует некоторые другие файлы.

e.g.

main.less содержит:

@import "lib/utils" @import "lib/account" @import "lib/settings"

Идея состоит в том, чтобы иметь один файл css во всем приложении.

Когда я сохраняю файл main.less, компилятор без точек автоматически генерирует файл main.css, однако, когда я сохраняю один из других файлов (например, utils.less), он просто генерирует файл utils.css, поэтому, если я внесу изменения в любой из файлов .less я должен открыть main.less и сохранить его, чтобы запустить компилятор и получить файл .css

Мне было интересно, есть ли способ автоматически скомпилировать основной файл less независимо от того, какой файл .less я сохраняю.

Спасибо


less compiler-construction dotless
person willvv    schedule 10.03.2012    source источник
comment
Если вы работаете с ASP.NET MVC 4, это можно легко исправить, используя новую функцию пакетов для упаковки файлов CSS.   -  person Richard Neil Ilagan    schedule 31.08.2012

Ответы (3)


arrow_upward
3
arrow_downward

Я использую Simpless для компиляции LESS, вы даете ему свой основной файл .less, и он будет смотреть его и любой дочерний файл. .less файлы и компилируются в фоновом режиме.

person Chao    schedule 13.03.2012
comment
Я проверю, спасибо за ссылку. Будет ли он также сжимать сгенерированный css? - person willvv; 13.03.2012
comment
Да, сжатие встроено в стандартную комплектацию и позволяет флагу в файле less отключать его для отладки. - person Chao; 13.03.2012

arrow_upward
0
arrow_downward

Это старая проблема, и, к сожалению, нет способа сделать это нативным способом. Компилятор LESS просто просматривает измененные файлы. Итак, если вы используете файл с импортом, этот файл необходимо изменить и перекомпилировать.

В среде разработки (с js) вы можете очистить кеш:

  <link rel="stylesheet/less" type="text/css" href="/css/style.less"/>
  <script src="/js/less-1.1.5.min.js" type="text/javascript"></script>
  <script>
    less = {env:'development'};
    function destroyLessCache(pathToCss) { // e.g. '/css/' or '/stylesheets/'
      if (!window.localStorage || !less || less.env !== 'development') {
        return;
      }
      var host = window.location.host;
      var protocol = window.location.protocol;
      var keyPrefix = protocol + '//' + host + pathToCss;

      for (var key in window.localStorage) {
        if (key.indexOf(keyPrefix) === 0) {
          delete window.localStorage[key];
        }
      }
    }
    window.onload=destroyLessCache('/css/');
  </script>

Ссылка: https://github.com/cloudhead/less.js/issues/47

person Shankar Cabus    schedule 11.03.2012
comment
Я больше искал решение, которое не позволяло бы мне что-то менять при переходе от разработки к производству. В итоге я импортировал файл .less в разработку и файл .css в производство. Когда файл .less импортируется напрямую (вместо .css), компилятор автоматически создает его повторно. Это возможно только в развитии. Единственное, чего не хватает, так это того, что мне нужно вручную генерировать .css при развертывании. - person willvv; 11.03.2012
comment
Да.. Вы должны скопировать сгенерированный css и вставить его в другой файл (желательно сжатый). Как вы можете видеть в ссылке на мой ответ, окончательного решения по этому вопросу до сих пор нет. Я тоже мучаюсь с этой проблемой =/ - person Shankar Cabus; 11.03.2012
comment
Что вы имеете в виду под копированием в другой файл? Компилятор без точек автоматически создает для меня сжатый файл .css, мне просто нужно запустить компилятор вручную перед развертыванием. - person willvv; 12.03.2012
comment
Я не использую dotless, но у lesscss (lesscss.org) есть два способа компилировать файл .less: javascript или серверный компилятор. У меня всегда проблемы с серверным компилятором, поэтому я предпочитаю использовать компилятор javascript для разработки, который генерирует css и помещает его в тег ‹head› в ‹style›. Итак, когда мне нужно внести какие-либо изменения в производство (это происходит не всегда), я копирую и вставляю этот код в другой файл .css. Но проблема та же, компилятор только помогает и перекомпилирует модифицированные файлы, так что попробуйте очистить кеш. - person Shankar Cabus; 12.03.2012

arrow_upward
0
arrow_downward

Winless делает именно это - это компилятор, похожий на simpless, но я считаю его более надежным. http://winless.org/ —

person user1010892    schedule 22.11.2012