오류 Browsersync를 두 번 시작하려고했습니다.

Question

내 꿀꺽 꿀꺽 소리 파일 내에서 browsersync를 설정하려고하는데 "이 오류가 계속 발생합니다. [오류] 두 번 브라우저 동기화를 시작하려고했습니다!"

내 gulpfile.js 파일은 다음과 같습니다.

var gulp = require('gulp'); 
var sass = require('gulp-sass');     // Compiles SASS 
var minifyCss = require('gulp-minify-css');   // Minifys CSS 
var concat = require('gulp-concat');    // Joins multipul files into one 
var rename = require('gulp-rename');    // Renames files 
var uglify = require('gulp-uglify');    // Minifys JS 
var browserSync = require('browser-sync');   // Refreshes browser on SCSS save 
var reload  = browserSync.reload; 

var scss_src = ['developer/sass/**/*.scss'];   // Set SCSS location 
var js_src = ['developer/js/**/*.js'];     // Set JS location 

// Browser sync 
gulp.task('browser-sync', function() { 
    var files = [ 
     scss_src  
    ]; 

    // Initialize browsersync 
    browserSync.init(files, { 
     proxy : 'localhost:8888', 
     notify : false 
    }); 
}); 

// SCSS tasks 
gulp.task('scss', function() { 
    gulp.src(scss_src)        // Reads all SCSS files 
     .pipe(sass().on('error', sass.logError)) // Compiles SASS and logs errors 
     .pipe(minifyCss())       // Minifys the CSS files 
     .pipe(concat('style.css'))     // Merges all the CSS files into one 
     .pipe(rename({        // Renames the merged CSS file 
      basename : 'style',      // The file name 
      extname : '.css'      // The file extension 
     })) 
     .pipe(gulp.dest('./'))      // Writes the renamed file to a destination 
     .pipe(reload({stream:true}))    // Reload the browser 

}); 

//JS tasks 
gulp.task('js', function() { 
    gulp.src(js_src) 
     .pipe(uglify()) 
     .pipe(rename({ 
      basename : 'main', 
      extname : '.min.js' 
     })) 
     .pipe(gulp.dest('./assets/js/')); 
}); 

// Watch task 
gulp.task('default', function() { 
    gulp.watch(scss_src, ['browser-sync']); 
    gulp.watch(scss_src, ['scss']); 
    gulp.watch(js_src, ['js']); 
}); 

모든 작업이 실행되고 모든 것이 browsersync 비트를 제외하고 작동합니다. 도움이 될 것입니다.

Answer 1

browser-sync 작업을 gulp.watch과 결합하면 문제가 발생합니다. 결과적으로 browser-sync을 실행할 때마다 scss_src이 변경됩니다.

시작시의 browser-sync 감시자를 제거하고 한 번만 작업을 실행합니다

// Watch task 
gulp.task('default', ['browser-sync'], function() { 
    gulp.watch(scss_src, ['scss']); 
    gulp.watch(js_src, ['js']); 
});