Laravel: How to use browserSync() in elixir?

Question

The following is gulpfile.js:

var elixir = require('laravel-elixir');
require('laravel-elixir-sass-compass');

elixir(function(mix) {
    mix.compass(['app.scss', 'controllers.scss']).version('css/app.css');
    mix.scripts(['jquery.js','app.js']).version('js/all.js');
});

Question:
I want to add browserSync() to gulpfile.js, how should I write it?
The document is as follows, but it needs to be added to the above code, and I don’t know how to do it.

elixir(function(mix) {
    mix.browserSync({ 
       proxy: 'project.app'
    });
});

Answer 1

Just like the official website, add that to your task. Of course, the example settings on the official website are relatively simple. In fact, other settings should go to browser-sync的官网看看的(看下它的gulpConfiguration Example). You can refer to my configuration below:

gulpfile.js

elixir(function(mix) {
    mix.sass('./resources/assets/sass/**/*.scss','public/dist/css/app.css');

    mix.browserify('index.js', 'public/dist/js/build-index.js');

    // 实时监听文件
    mix.browserSync({
        proxy: '192.168.0.112',   // apache或iis等代理地址
        port: 3000,
        notify: false,        // 刷新是否提示
        watchTask: true,
        open: 'external',
        host: '192.168.0.112',  // 本机ip, 这样其他设备才可实时看到更新
    });

});

You can read these two notes, which may be helpful for your understanding:
browser-sync configuration
laravel-elixir configuration