Как быстро начать использовать LESS в своих проектах.
src
- исходники. Даны несколько файлов для примера. Компилируется файл /src/less/style.less
.
build
- собранный проект.
Как работать с консолью в Windows.
- Скачать репозиторий и поместить его файлы в свой. Или склонировать репозиторий и начать в нем работать.
- В консоли «зайти» в папку проекта и вызвать команду
npm i
. Дождаться окончания установки зависимостей. - Для старта работы с проектом, вызвать команду
grunt
(если будет ругаться на отсутствие гранта, вызовайте командуnpm install -g grunt-cli
и дождитесь его установки). - Для завершения работы над проектом нажать Ctrl+C.
В Gruntfile.js описаны сами задачи и, в самом низу, списки задач, выполняемых при вызове команды grunt
и других. Всё подробно комментировано.
grunt
— компиляция, копирование, обработка CSS, старт слежения и локального сервера. См. Gruntfile.js
grunt style
— только задачи, качающиеся стилей (компиляция, постобработка, оптимизация).
grunt less
— только компиляция LESS → CSS.
grunt build
— компиляция, копирование, обработка CSS и публикация этого всего на GitHub Pages.
GitHub Pages — сервис GitHub, позволяющий «хостить» Ваши файлы (в случае с этим репозиторием — сразу увидеть вёрстку).
После вызова команды grunt build
, в Вашем репозитории появится ветка gh-pages
, в которой будет то же самое, что в папке build
.
В сети Ваша верстка будет доступна по адресу: http://ВАШ-НИКНЕЙМ.github.io/ИМЯ-ВАШЕГО-РЕПОЗИТОРИЯ
Если локальный сервер и слежение уже запущены, добавленные после запуска файлы не отслеживаются. Перезапустите локальный сервер и слежение (нажать Ctrl+C, а потом снова стартовать командой grunt
).