目前測試的版本:
- Laravel 5.2.29
- laravel-elixir 5.0.0
1. 建立 Laravel 專案
composer create-project laravel/laravel myproject --prefer-dist
2. npm 安裝套件
npm install
3. 修改專案中的 gulpfile.js
mix.browserSync({
proxy : 'localhost:8000'
});
更多 BrowserSync 的選項可以看這裡: https://www.browsersync.io/docs/options/
4. 用 php 內建 server 啟動專案
php artisan serve --host 0.0.0.0
務必要加上 --host 0.0.0.0 不然不會成功, 不要問為什麼, 踩過 N 次的雷的結論!!!
5. 執行瀏覽同步
gulp watch
如果你不是用 Homestead, 請再次確認 Proxying 為你設定的 proxy 而非 http://homestead.app
它會幫你開啟預設瀏覽器, 開啟同步的 URL, 我的範例為 http://localhost:3000
BrowserSync 的 UI 為 http://localhost:3001
說實在的, 啟用 BrowserSync 只有一點點眉角, 只有一小步, 解後卻能跨出一大步!
開心寫 code 吧!!
沒有留言:
張貼留言