Gulp watch 只检测到第一个变化答案

【问题标题】：Gulp watch only detects the first changeGulp watch 只检测到第一个变化
【发布时间】：2020-01-01 17:40:42
【问题描述】：

我正在研究 gulp 并实现 watch 功能。但是 gulp watch 仅在第一次检测到更改。

我想编写代码，以便它检测 CSS 和 JS 文件中的更改并在开发环境中执行缩小和连接。

我正在使用以下代码：

var gulp = require('gulp');
var concat = require('gulp-concat');
var clean_css = require('gulp-clean-css');
var uglify = require('gulp-uglify');

gulp.task('style', function(){
    gulp.src(['assets/css/style.css', 'assets/css/custom.css'])
        .pipe(concat('build.min.css'))
        .pipe(clean_css())
        .pipe(gulp.dest('assets/build'));
});

gulp.task('script', function(){
    gulp.src(['assets/js/jquery.js', 'assets/js/custom.js'])
        .pipe(concat('build.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('assets/build'));
});

gulp.task('watch', function(){
    gulp.watch('assets/css/*.css', gulp.series('style') );
    gulp.watch('assets/js/*.js', gulp.series('script'));
});

【问题讨论】：

标签： javascript gulp gulp-watch

【解决方案1】：

这可能是因为 gulp 第一次不知道任务已经完成，所以下次修改文件时它不会重新启动任务。这可以通过在您的任务中添加return 语句来解决：

gulp.task('style', function(){
  return gulp.src(['assets/css/style.css', 'assets/css/custom.css'])
    .pipe(concat('build.min.css'))
    .pipe(clean_css())
    .pipe(gulp.dest('assets/build'));
});

gulp.task('script', function(){
  return gulp.src(['assets/js/jquery.js', 'assets/js/custom.js'])
    .pipe(concat('build.min.js'))
    .pipe(uglify())
    .pipe(gulp.dest('assets/build'));
});

【讨论】：