Есть ли способ скомпилировать файлы LESS в CSS (чтобы это не требовалось каждому браузеру)?

Я рассматриваю возможность использования LESS, но меня беспокоит мысль о том, что в браузере отключен JavaScript и мой CSS не читается (а сайт выглядит ужасно).

Кроме того, меня оскорбляет инженер, заставляющий каждый браузер «компилировать» этот файл Less в .css, когда мы можем просто «компилировать» его один раз при каждом его изменении.

Да. Вы можете использовать приложение, которое автоматически компилирует файлы LESS в CSS на вашем компьютере для разработки при кодировании. Затем просто загрузите сгенерированный файл CSS на свой сервер, когда закончите разработку.

• Crunch! для Windows и Mac
• WinLess для Windows
• CodeKit для Mac

Я использую SimpLESS - перетащить, отпустить, готово.

LESS поставляется с двоичным файлом (lessc), который позволяет вам предварительно скомпилировать ваши файлы .less. Вы используете его как таковой:

 $ lessc styles.less > styles.css

Но я думаю, что большинство людей просто используют команду lessc -wor lessc --watchдля автоматической перекомпиляции таблицы стилей CSS при каждом обновлении файла LESS. Вы также можете уменьшить CSS, например lessc -w -x.

Редактировать: просто чтобы уточнить, lessc поставляется с установкой на стороне сервера (то есть, когда вы устанавливаете less через менеджер пакетов node.js). Но вы можете скачать его вручную с GitHub .

Лессек находится по адресу /bin/lessc. Это, конечно , в * NIX двоичном (также должны работать на Mac), но это бинарное для Windows ( lessc.exe ) на основе Dotless, что является еще одним Windows , МЕНЬШЕ компилятор.

Обновление: используйте less-watchдля автоматической компиляции.

В качестве альтернативы, многие разработчики в настоящее время используют такие исполнители, как gruntавтоматизация сборки (компиляция, минимизация, тестирование и т. Д.). Используя grunt-contrib-watch, grunt-contrib-lessи grunt-contrib-livereloadвы действительно можете оптимизировать рабочий процесс разработки.

Например, если вы используете yoдля создания своего нового веб-проекта, он предварительно настроен для просмотра ваших файлов LESS / CSS / JS / HTML на предмет изменений и при необходимости перекомпилирует необходимые части вашего проекта. Просто запустите grunt serve, и вы готовы писать код, не беспокоясь о том, чтобы вручную скомпилировать (LESS / SASS / CoffeeScript) / минимизировать / объединить ваш код или обновить браузер вручную, как пещерный человек ...

Существует несколько вариантов компиляции LESS в CSS на сервере, и тот, который вы выберете, вероятно, будет зависеть от того, что вы используете для остальной части сайта.

• Если вы используете node.js, оригинальное lesscss сделает эту работу.
• Если вы используете PHP, lessphp . Он имеет немного мусор API, когда дело доходит до передачи переменных из PHP, но он делает свою работу.
• Если вы используете Ruby, SASS не LESS, но настолько похож, что когда я переключился с использования SASS (персональный проект) на LESS (проект PHP на работе), я не заметил никаких отличий, кроме расширения файла. Также есть полезная библиотека миксинов - КОМПАС . Я не пробовал использовать их с LESS, но я ожидаю, что они сработают. (По-видимому, LESS изначально был Ruby, так что, вероятно, где-то где-то есть старый компилятор).
• Если вы используете ASP.Net, есть .less . Я не использовал этот, поэтому я не знаю, насколько хорошо он работает.
• Если вы используете Java, lesscss4j завершает компиляцию с оригинальной LESS и встроенной в Java 6 средой сценариев Rhino.
• Если вы используете Perl, в CPAN есть модуль LESSp .