Gulp监视在文件更改时不触发minify

Question

我有一个简单的入门应用程序，我创建了gulpfile.js文件的内容如下，

let gulp = require('gulp');
let cleanCSS = require('gulp-clean-css');
// Task to minify css using package cleanCSs
gulp.task('minify-css', () => {
     // Folder with files to minify
     return gulp.src('src/assets/styles/*.css')
     //The method pipe() allow you to chain multiple tasks together 
     //I execute the task to minify the files
    .pipe(cleanCSS())
    //I define the destination of the minified files with the method dest
    .pipe(gulp.dest('src/assets/dist'));
});

//We create a 'default' task that will run when we run `gulp` in the project
gulp.task('default', function() {
// We use `gulp.watch` for Gulp to expect changes in the files to run again
  gulp.watch('./src/assets/styles/*.css', function(evt) {
    gulp.task('minify-css');
  });
});

如果我运行gulp minify-css，它会正常工作，但我需要它在文件更改时缩小

但它的所有功能都会在cmd窗口中记录一条消息，比如“Starting...”

我甚至不知道这是什么意思。

package.json：

..
     "gulp": "^4.0.2",
     "gulp-clean-css": "^4.2.0"

Answer 1

我认为您需要在运行任务minify-css时添加return，以便系统知道前一个任务何时完成。

gulp.task('default', function() {
// We use `gulp.watch` for Gulp to expect changes in the files to run again
  gulp.watch('./src/assets/styles/*.css', function(evt) {
    return gulp.task('minify-css');
  });
});