Browsersync - TwoGears/hakomo-guides GitHub Wiki

An awesome tool for faster front-end development. Provides live reload on save, synchronised across multiple browsers and devices.

Installation:

  • Requires npm
  • Install globally npm install -g browser-sync
  • Install locally to a project npm install browser-sync --save-dev

Basic usage

  • Command Line
    • While in a project directory: browser-sync start --proxy="localhost:8080" --files="*.html, css/*.css"
    • You can track all files in a directory by doing the following: browser-sync start --proxy="72box.dev" --files="app/webroot/**/*/"
    • Proxies localhost and watches CSS/HTML files. Opens another server on (usually) your-ip-address:3000 (also shows it in the command line)
    • Visit the new url from your browsers and devices. Now every action you make in one is copied to all.
      And no more manual reloading on change!
  • Gulp