爲什麼'gulp watch'沒有更新？

Question

這裏可能有一些小樣式的問題，但大多數情況下這是有效的。但是，它似乎沒有在看該文件夾中的styles/*.scss文件或新SCSS的更改。與Javascript相同的東西：scripts/*.js不在手錶上更新。

也可以將SCSS和CSS結合起來而不破壞源映射，但這並不重要。現在，只要獲得實時更新就可以工作。

const gulp = require('gulp') 
const plumber = require('gulp-plumber') 
const rename = require('gulp-rename') 
const autoprefixer = require('gulp-autoprefixer') 
const babel = require('gulp-babel') 
const concat = require('gulp-concat') 
const sass = require('gulp-sass') 
const browserSync = require('browser-sync') 
const clean = require('gulp-clean') 
const sourcemaps = require('gulp-sourcemaps'); 
const uglify = require('gulp-uglify'); 
const minifycss = require('gulp-minify-css'); 

const gulpfn = require('gulp-fn') 
const fs = require('fs'); 

const util = require('gulp-util'); 
let config = { production: !!util.env.production } 

gulp.task('clean', function() { 
    return gulp.src('build', {read: false}) 
     .pipe(clean()) 
     .pipe(gulpfn(function (file) { 
      if (!fs.existsSync('build')){ 
       fs.mkdirSync('build'); 
      } 
     }));  
}); 

gulp.task('browser-sync', function() { 
    browserSync({ 
    server: { 
     baseDir: "./build" 
    } 
    }); 
}); 

gulp.task('bs-reload', function() { 
    browserSync.reload(); 
}); 

gulp.task('styles', function(){ 
    gulp.src(['source/styles/**/*.scss']) 
    .pipe(plumber({ 
     errorHandler: function (error) { 
     console.log(error.message); 
     this.emit('end'); 
    }})) 
    .pipe(sourcemaps.init()) 
    .pipe(sass()) 
    .pipe(autoprefixer('last 2 versions')) 
    .pipe(gulp.dest('build/styles/')) 
    .pipe(rename({suffix: '.min'})) 
    .pipe(config.production ? minifyCSS() : util.noop()) 
    .pipe(sourcemaps.write()) 
    .pipe(gulp.dest('build/styles/')) 
    .pipe(browserSync.reload({stream:true})) 
}); 

gulp.task('scripts', function(){ 
    return gulp.src('source/scripts/**/*.js') 
    .pipe(plumber({ 
     errorHandler: function (error) { 
     console.log(error.message); 
     this.emit('end'); 
    }})) 
    .pipe(concat('main.js')) 
    .pipe(babel({presets: ['es2015', 'es2016']})) 
    .pipe(gulp.dest('build/scripts/')) 
    .pipe(rename({suffix: '.min'})) 
    .pipe(config.production ? uglify() : util.noop()) 
    .pipe(gulp.dest('build/scripts/')) 
    .pipe(browserSync.reload({stream:true})) 
}); 

gulp.task('external-scss', function(){ 
    gulp.src(['external/font-awesome-4.7.0/scss/*.scss']) 
    .pipe(plumber({ 
     errorHandler: function (error) { 
     console.log(error.message); 
     this.emit('end'); 
    }})) 
    .pipe(sourcemaps.init()) 
    .pipe(sass()) 
    .pipe(autoprefixer('last 2 versions')) 
    .pipe(gulp.dest('build/external/font-awesome-4.7.0/css/')) 
    .pipe(rename({suffix: '.min'})) 
    .pipe(config.production ? minifyCSS() : util.noop()) 
    .pipe(sourcemaps.write()) 
    .pipe(gulp.dest('build/external/font-awesome-4.7.0/css/')) 
    .pipe(browserSync.reload({stream:true})) 
}); 

const STATIC_STYLES = ['source/styles/**/*.css'] 
const STATIC_HYPERTEXT = ['source/**/*!template.html', 'source/**/*.html'] 
const STATIC_TEMPLATES = ['source/templates/*.template.html'] 

gulp.task('static-sources', function(){ 
    gulp.src(STATIC_STYLES) 
     .pipe(gulp.dest('build/styles/')) 
    return gulp.src(STATIC_HYPERTEXT) 
     .pipe(gulp.dest('build/')) 
}); 

gulp.task('default', ['browser-sync', 'styles', 'scripts', 'external-scss', 'static-sources'], function(){ 
    gulp.src(['external/font-awesome-4.7.0/fonts/fontawesome-webfont.*']).pipe(gulp.dest('build/external/font-awesome-4.7.0/fonts')); 
    gulp.src('external/font-awesome-4.7.0/scss/*.scss', ['external-scss']); 

    gulp.src(['external/fccfavicons-master/*']).pipe(gulp.dest('build/external/fccfavicons-master')); 

    gulp.src(['node_modules/jquery/dist/*']).pipe(gulp.dest('build/external/jquery/dist')); 

    gulp.src(['node_modules/lodash/**/*']).pipe(gulp.dest('build/external/lodash')); 

    gulp.src(['node_modules/normalize.css/*.css']).pipe(gulp.dest('build/external/normalize.css')); 

    gulp.watch('source/styles/**/*.scss', ['styles']); 
    gulp.watch('source/scripts/**/*.js', ['scripts']); 

    let static_sources = [] 
    static_sources.push(...STATIC_HYPERTEXT) 
    static_sources.push(...STATIC_STYLES) 
    gulp.watch(static_sources, ['static-sources']); 

    gulp.watch('*.html', ['bs-reload']); 
}); 

Answer 1

您需要添加return語句在你的其他任務，除了劇本，發信號給吞掉，他們都完成了。