Как настроит browser-sync для работы с js файлами?

Question

[Neuro]

Хочу настроить браузерсунк на автоматическое обноновление страницы после изменения в js файлах, но дефолтные настройки его не прдусматривают вотчер за js файлами, как только не пытался изменять таск (gulp.watch("*.оы").on("change", reload);), нечего не получается, может у кого то есть пример использования?

Answer 1

[Никита Егоров]

Вот:

gulp.task('browser-sync', function() {
    browserSync({
        server: { 
            baseDir: 'dev/client'
        },
        notify: false
    });
});

gulp.task('watch', ['browser-sync',], function() {
    gulp.watch('ваш_путь/**/*.js', browserSync.reload);
});

Comments

[Neuro]

возникает такая ошибка

[Никита Егоров]

Riveran, во первых скиньте весь ваш gulpfile или же ваш таск serve но сначала попробуйте переписать такс default так : gulp.task('default', ['serve', 'watch'])

[Neuro]

var gulp        = require('gulp');
var browserSync = require('browser-sync').create();
var sass        = require('gulp-sass');

// Static Server + watching scss/html files
gulp.task('serve', ['sass'], function() {

    browserSync.init({
        server: "./app"
    });

    gulp.watch("app/scss/*.scss", ['sass']);
    gulp.watch("app/*.html").on('change', browserSync.reload);
});

// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
    return gulp.src("app/scss/*.scss")
        .pipe(sass())
        .pipe(gulp.dest("app/css"))
        .pipe(browserSync.stream());
});

gulp.task('browser-sync', function() {
    browserSync({
        server: { 
            baseDir: 'dev/client'
        },
        notify: false
    });
});

gulp.task('watch', ['browser-sync',], function() {
    gulp.watch('app/js/*.js', browserSync.reload);
});

gulp.task('default', ['serve', 'watch'])

[Никита Егоров]

Riveran,

var gulp        = require('gulp');
var browserSync = require('browser-sync')
var sass        = require('gulp-sass');

// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
    return gulp.src("app/scss/*.scss")
        .pipe(sass())
        .pipe(gulp.dest("app/css"))
        .pipe(browserSync.stream());
});

gulp.task('browser-sync', function() {
    browserSync({
        server: { 
            baseDir: './app'
        },
        notify: false
    });
});

gulp.task('watch', ['browser-sync', 'sass'], function() {
    gulp.watch('app/js/*.js', browserSync.reload);
    gulp.watch("app/scss/*.scss", ['sass']);
    gulp.watch("app/*.html", browserSync.reload);
});

gulp.task('default', ['watch'])

[Никита Егоров]

Riveran, Я проверил, этот скрипт работает

[Neuro]

Никита Егоров, воу, я больше суток бился над этой проблемой, но всё бестолку, огромное спасибо вам, всё заработало

Answer 2

[dsmaslov]

https://browsersync.io/docs/gulp#gulp-reload