tech blog技術メモ

Web制作に関連する技術を発信しています。

Browsersyncの基本的な使い方

開発でたいへんお世話になっているBrowsersyncの基本的な使い方をまとめておく。

Browsersyncのインストール

npm i -D browser-sync

基本設定

"scripts": {
  "browsersync": "browser-sync start --server --files './*.html' '**/*'"
}

--serverオプションを忘れると動かないので注意。 --filesオプションで監視したいファイルを設定すると、変更があった際に自動でリロードを行ってくれる。

以上で必要最小限の設定は完了。 あとは必要に応じて公式ドキュメントを元に設定。