LaravelのElixirでbrowserSyncを導入する
LaravelのElixirでビルド後にブラウザを自動で再表示するために、browserSyncを導入しました。
最初は単純に以下のようにしてgulp watchを実行してみました。
elixir(mix => {
mix.webpack('app.js')
.browserSync({proxy: 'localhost:8000'});
});すると、以下のエラーが発生しました。
To use "mix.browserSync()", please run the following command, and then trigger gulp again.
=======================================================
npm install laravel-elixir-browsersync-official --save-dev
=======================================================browserSyncをするためには「laravel-elixir-browsersync-official」が必要とのことなので、提示されたコマンド通りにインストールします。
npm install laravel-elixir-browsersync-official --save-devインストール後、再度gulp watchを実行すると、自動でlocalhost:3000がブラウザで立ち上がりました。しかし、ずっと読み込み中のまま、画面が表示されません。
表示させるためには、php artisan serveを実行して、laravelが動かせるようにしておく必要があります。