Как получить приложение Laravel 5.3 для автоматической перезагрузки при изменении SASS / JS

Хотите автоматически перезагружать страницу всякий раз, когда я меняю свой SASS или Javascript, но не уверен, как это сделать с WebPack в laravel 5.3. Я слышал о горячей замене модуля, но, кажется, действительно сложно, есть ли способ, которым я могу интегрировать его в мой файл gulpfile.

Gulpfile:

const elixir = require('laravel-elixir');

require('laravel-elixir-vue-2');

/*
|--------------------------------------------------------------------------
| Elixir Asset Management
|--------------------------------------------------------------------------
|
| Elixir provides a clean, fluent API for defining some basic Gulp tasks
| for your Laravel application. By default, we are compiling the Sass
| file for your application as well as publishing vendor resources.
|
*/

elixir((mix) => {
mix.sass('app.scss')
.webpack('app.js');
});

РЕДАКТИРОВАТЬ (пробовал BrowserSync, но он не обновляется)

const elixir = require('laravel-elixir');

require('laravel-elixir-vue-2');
var BrowserSync = require('laravel-elixir-browsersync-official');

/*
|--------------------------------------------------------------------------
| Elixir Asset Management
|--------------------------------------------------------------------------
|
| Elixir provides a clean, fluent API for defining some basic Gulp tasks
| for your Laravel application. By default, we are compiling the Sass
| file for your application as well as publishing vendor resources.
|
*/

elixir((mix) => {
mix.sass('app.scss')
.webpack('app.js')
.browserSync({
port: 8000,
proxy: 'localhost'
});
});

0

Решение

Вы могли бы использовать что-то вроде browserSync,

Установить browserSync бежать:

npm install laravel-elixir-browsersync-official --save

Тогда в вашем gulpfile просто добавьте:

.browserSync({
proxy: 'app.dev',
})

(менять app.dev на ваш фактический URL приложения)

Затем, когда вы бежите gulp watch браузер должен автоматически перезагрузиться, когда обнаружит изменение.

Надеюсь это поможет!

2

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]