browser-sync を使ってお手軽にライブリロードする
今までライブリロードといえば gulp を使っていたんですが、 『動作確認用のサンプルコードとかでいちいち gulpfile.js を用意するのめんどいなー』 と思い、もっとお手軽にライブリロード出来ないか探していたんですが Browsersync というのがよさそうでした。
Browsersync のインストール
Browsersync は npm
からインストールします。
# いちいちローカルに保存したくないのでグローバルにインストール $ npm install browser-sync -g
これで browser-sync
コマンドが使えるようになります。
Browsersync の使い方
$ browser-sync start --server --files "index.html"
これにより開発用のサーバが立ち上がり、ファイルの変更があったら自動的にブラウザがリロードされます。
監視するファイルは --files
で指定することができ、
--files *.html
や
--files "*.html, *.css, *.js"
のように設定することも出来ます。
所感
とにかくローカルに余計なファイルを置く必要がないのでめっちゃ便利そう。