Как бороться с BrowserSync и gulp-watch? - PullRequest
Новая
       86

Как бороться с BrowserSync и gulp-watch?

0 голосов
/ 09 ноября 2019

Я пытаюсь настроить свой файл gulpfile.js с такими функциями, как «преобразование scss в css» / watcher / live reload. 

// Variables
var gulp = require('gulp');
var plugins = require('gulp-load-plugins')();
var source = './src';
var destination = './dist';
var browserSync = require('browser-sync');

// Server
gulp.task('browserSync', function(){
    browserSync.init({
        server: {
            baseDir: 'src'
        }
    })
});

// Task build : Scss -> Css
gulp.task('buildCss', function () {
    return gulp.src(source + '/assets/styles/*.scss')
        .pipe(plugins.sass())
        .pipe(plugins.cssbeautify({indent: '  '}))
        .pipe(plugins.autoprefixer())
        .pipe(gulp.dest(destination + '/assets/styles/'));
});

gulp.task('watch', function () {
    gulp.watch(source + '/assets/styles/*.scss', gulp.series('buildCss'));
});

gulp.task('startDev', gulp.series('browserSync', 'watch'));

Сначала я создал код преобразования css, после того как сделалwatcher, и это работало хорошо, но когда я добавил часть "browserSync", это сломало все. Когда я запускаю «startDev», открывается новая вкладка, поэтому сервер запускается, я думаю, но ничего не происходит после того, как вы можете увидеть на консоли здесь: https://i.stack.imgur.com/u82Jn.png

Есть ли у вас какие-либо идеи, где может возникнуть проблемаот?

Заранее спасибо

...