Набор скриптов для автоматизации front end разработки, включает в себя:
Для работы скриптов необходимо установить Ruby, Python, Java (при использовании сжатия javascript).
Также нужны следующие пакеты Ruby:
После установки клонируем репозиторий-заготовку и запускаем grunt из корня проекта.
Теперь можно использовать html вставки
Все javascript файлы из директории src/js/ собираются в файл prod/js/all.js (или all.min.js при использовании сжатия).
В репозиторий включен скрипт live.js т.к. livereload плагин для браузеров под Ubuntu заработал только в Chrome. Из окончательной вёрстки live.js нужно убрать.
В файле htmlInclude.py находится скрипт сборки html. По умолчанию файлы с расширением htm включаются в файлы html.
config.rb содержит настройки compass, для включения сжатия css нужно раскомментировать строку
В Guardfile настройки слежения за файлами. Для включения сжатия javascript нужно скачать yuicompressor и раскомментировать строку
Grunt мне показался слишком громоздким и не гибким (например после добавления нового javascript-а его нужно дописывать в конфиг Gruntfile.js) а других решений не нашлось, вышел такой вот велосипед на основе Guard.
- сборщик html файлов
- препроцессор SASS с фреймворком compass
- сборщик javascript файлов
- livereload
Установка и запуск
Для работы скриптов необходимо установить Ruby, Python, Java (при использовании сжатия javascript).
Также нужны следующие пакеты Ruby:
После установки клонируем репозиторий-заготовку и запускаем grunt из корня проекта.
Теперь можно использовать html вставки
@@include имя_файла.htm пользоваться плюшками фреймворка compass и livereload Все javascript файлы из директории src/js/ собираются в файл prod/js/all.js (или all.min.js при использовании сжатия).
В репозиторий включен скрипт live.js т.к. livereload плагин для браузеров под Ubuntu заработал только в Chrome. Из окончательной вёрстки live.js нужно убрать.
Настройка
В файле htmlInclude.py находится скрипт сборки html. По умолчанию файлы с расширением htm включаются в файлы html.
config.rb содержит настройки compass, для включения сжатия css нужно раскомментировать строку
output_style = :compressedВ Guardfile настройки слежения за файлами. Для включения сжатия javascript нужно скачать yuicompressor и раскомментировать строку
java -jar /путь/к/yuicompressor.jar ./prod/js/all.js -o ./prod/js/all.min.js && rm -rf ./prod/js/all.jsЗачем
Grunt мне показался слишком громоздким и не гибким (например после добавления нового javascript-а его нужно дописывать в конфиг Gruntfile.js) а других решений не нашлось, вышел такой вот велосипед на основе Guard.