Данный инструмент предназначен для оптимизации рабочего времени front-end специалистов.
- jade - препроцессор html;
- stylus - препроцессор css(nib);
- connect - сервер приложения;
- copy - копирование файлов в обход препроцессора;
- watch - планировщик. Выполняет функцию отслеживания изменений файлов и быстрой компиляции из исходников.
Давайте для начала установим необходимые инструменты, для работы fewatcher
- Скачать и установить последнюю версию nodeJS
- После установки у Вас будет доступен node package manager
npm install -g grunt- Ознакомьтесь со статьей по установке git, под Вашу операционную систему
Эти 4 шага, Вы выполняете разово, и больше этого не потребуется. В них мы устанавливаем программы, знание которых не является обязательным, для работы с fewatcher
Для начала работы с новым проектом, Вам нужно будет выполнить 3 новых команды:
git clone [email protected]:jslby/fewatcher.git my_project, гдеmy_projectэто директория, где будет Ваше приложениеnpm installgrunt
В первой команде, мы клонируем репозиторий себе на компьютер, потом запускаем установку всех зависимостей.
Последней же командой мы запускаем сервер с Вашей версткой на http://0.0.0.0:3000
После этого Вы можете работать в директории source.
Сайт будет доступен по адресу 0.0.0.0:3000.
Готовая верстка хранится в директории dest.
Для работы LiveReload, добавьте эту строку перед закрывающим тегом body
<script src="//localhost:35729/livereload.js"></script>