Работа верстальщика требует постоянных перезагрузок браузера: поменял размер шрифта, поправил отступ, сменил цвет – обнови и посмотри, что получилось. Это отнимает время (пусть и немного) и быстро надоедает. В общем, хватит отвлекаться на такую ерунду – пора все это автоматизировать.
Отличный удобный инструмент для живой перезагрузки – browser-sync.
Он хорошо сочетается с таск-раннерами вроде gulp, но и сам по себе замечательно работает. Разберемся, как использовать browser-sync самостоятельно из командной строки.
Установка
Сначала нужно глобально установить этот пакет на компьютер (конечно, нужны Node и npm):
npm install -g browser-syncОткроем терминал в нужной папке. Теперь у нас появилась команда browser-sync.
Запуск
Запуск осуществляется с помощью команды start, а также понадобятся некоторые флаги.
Сервер
Для верстки нам хватит статического сервера, поэтому будем пользоваться server-режимом. Еще есть proxy-режим для работы с PHP-сервером или чем-то подобным.
Нужный режим запускается с помощью флага --server или -s.
Файлы для отслеживания
Пути отслеживаемых файлов определяются с помощью флага --files или -f. Мы будем отслеживать все файлы в директории.
Флагов, на самом деле, довольно много. полный список можно посмотреть в документации.
Поехали
Команда целиком выглядит так:
browser-sync start -s -f *Совсем несложно. Запустили и все – можно работать. Все изменения сразу будут отображаться в браузере, без лишних движений.
1 комментарий