Данный инструмент предназначен для оптимизации рабочего времени 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 install
grunt
В первой команде, мы клонируем репозиторий себе на компьютер, потом запускаем установку всех зависимостей.
Последней же командой мы запускаем сервер с Вашей версткой на http://0.0.0.0:3000
После этого Вы можете работать в директории source
.
Сайт будет доступен по адресу 0.0.0.0:3000
.
Готовая верстка хранится в директории dest
.
Для работы LiveReload, добавьте эту строку перед закрывающим тегом body
<script src="//localhost:35729/livereload.js"></script>