Живая перезагрузка с browser-sync

Живая перезагрузка с browser-sync

Работа верстальщика требует постоянных перезагрузок браузера: поменял размер шрифта, поправил отступ, сменил цвет – обнови и посмотри, что получилось. Это отнимает время (пусть и немного) и быстро надоедает. В общем, хватит отвлекаться на такую ерунду – пора все это автоматизировать.

Отличный удобный инструмент для живой перезагрузки – browser-sync.

Он хорошо сочетается с таск-раннерами вроде gulp, но и сам по себе замечательно работает. Разберемся, как использовать browser-sync самостоятельно из командной строки.

Установка

Сначала нужно глобально установить этот пакет на компьютер (конечно, нужны Node и npm):

Откроем терминал в нужной папке. Теперь у нас появилась команда browser-sync.

Запуск

Запуск осуществляется с помощью команды start, а также понадобятся некоторые флаги.

Сервер

Для верстки нам хватит статического сервера, поэтому будем пользоваться server-режимом. Еще есть proxy-режим для работы с PHP-сервером или чем-то подобным.

Нужный режим запускается с помощью флага --server или -s.

Файлы для отслеживания

Пути отслеживаемых файлов определяются с помощью флага --files или -f. Мы будем отслеживать все файлы в директории.

Флагов, на самом деле, довольно много. полный список можно посмотреть в документации.

Поехали

Команда целиком выглядит так:

Совсем несложно. Запустили и все – можно работать. Все изменения сразу будут отображаться в браузере, без лишних движений.

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *