BrowserSync konfigurācija

gulpfile.js

var gulp = require('gulp');
var plumber = require('gulp-plumber');
var sourceMaps = require('gulp-sourcemaps');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var gulpIf = require('gulp-if');
var cssnano = require('gulp-cssnano');
var browserSync = require('browser-sync').create();
var webpack = require('webpack-stream');

gulp.task('sass', function() {
    return gulp.src('sass/**/*.scss')
        .pipe(plumber())
        .pipe(sourceMaps.init())
        .pipe(sass().on('error', sass.logError))
        .pipe(autoprefixer({
            browsers: ['> 0.5%'],
            cascade: false
        }))
        .pipe(gulpIf('*.css', cssnano({
            discardUnused: false,
            zindex: false
        })))
        .pipe(sourceMaps.write('./'))
        .pipe(gulp.dest('./'))
        .pipe(gulpIf('*.css', browserSync.stream()));
});

gulp.task('js', function () {
    return gulp.src('js/dev/app.js')
        .pipe(webpack({
            watch: true,
            output: {
                filename: 'app.js'
            },
            module: {
                loaders: [
                    {
                        test: /\.js$/,
                        exclude: /node_modules/,
                        loader: 'babel-loader',
                        query: {
                            presets: ['es2015']
                        }
                    }
                ]
            }
        }))
        .pipe(gulp.dest('js/'));
});

gulp.task('serve', null, function() {

    browserSync.init({
        open: "external",
        host: "localhost",
        proxy: "localhost"
    });

    gulp.watch("sass/**/*.scss", ['sass']);
    gulp.watch("js/dev/*.js", ['js']);
    gulp.watch("**/*.php", { interval: 500 }).on('change', browserSync.reload);
    gulp.watch("js/app.js", { interval: 500 }).on('change', browserSync.reload);
});