为什么Gulp在运行依赖它的任务之前没有完成我的“干净”任务?

时间:2015-01-23 15:09:53

标签: javascript gulp

我有一个gulpfile,应该在缩小代码之前清理我的dist目录。有时,干净的任务仍在运行,同时代码被缩小,导致一些丢失的文件。

导致它的原因是什么?我的理解是,任务的依赖关系将在任务运行之前 完成,并且依赖关系只会运行一次,即使它是多个任务的依赖关系。

var gulp = require('gulp');
var gulpLoadPlugins = require('gulp-load-plugins');
var plugins = gulpLoadPlugins();
var del = require('del');

gulp.task('default', ['css', 'js', 'fonts']);

gulp.task('clean', function(cb) {
  del(['dist/**'], cb);
});

gulp.task('css', ['clean'], function() {
  return gulp.src('style.css')
            .pipe(plugins.autoprefixer({
              browsers: ['last 2 versions']
            }))
            .pipe(gulp.dest('dist'))
            .pipe(plugins.minifyCss({
              noRebase: true,
              keepSpecialComments: 0
            }))
            .pipe(plugins.rename({extname: '.min.css'}))
            .pipe(gulp.dest('dist'));
});

gulp.task('js', ['clean'], function() {
  return gulp.src('scripts.js')
            .pipe(gulp.dest('dist'))
            .pipe(plugins.uglify({preserveComments: 'some'}))
            .pipe(plugins.rename({extname: '.min.js'}))
            .pipe(gulp.dest('dist'));
});

gulp.task('fonts', ['clean'], function() {
  return gulp.src('fonts/*')
            .pipe(gulp.dest('dist/fonts'));
});

UPDATE: Gulp输出表明clean任务在其他任务启动之前完成,但有时并非所有输出文件都在dist目录中。有时他们是。

[09:47:15] Using gulpfile /Users/raddevon/Documents/projects/AlphaBlog/theme/gulpfile.js
[09:47:15] Starting 'clean'...
[09:47:15] Finished 'clean' after 8.06 ms
[09:47:15] Starting 'css'...
[09:47:15] Starting 'js'...
[09:47:16] Starting 'fonts'...
[09:47:16] Finished 'js' after 399 ms
[09:47:16] Finished 'css' after 899 ms
[09:47:16] Finished 'fonts' after 267 ms
[09:47:16] Starting 'default'...
[09:47:16] Finished 'default' after 7.78 μs

2 个答案:

答案 0 :(得分:11)

使用del.sync(),其他任务将仅在清理任务完成后启动。

gulp.task('clean', function () {
    del.sync(['./build/**']);
});

同时检查此帖子: How to clean a project correctly with gulp?

答案 1 :(得分:3)

running tasks in series开始查看Gulp documentation

如果你有一个干净的任务,那么可能会尝试从上面的第二个例子返回流,看看是否有帮助。

我个人希望更清晰地完成清洁任务,(更像第一个例子),所以你总是可以尝试这样的事情:

...

// minify css
gulp.task('clean:css', function(cb) {
  del(['dist/*.css'], cb);
});

gulp.task('comp:css', ['clean:css'], function(cb) {
  return gulp.src('style.css')
    .pipe(minifyCss())
    .pipe(rename('style.min.css'))
    .pipe(gulp.dest(build.css), cb);
});

gulp.task('css', ['comp:css']);

// concat js
gulp.task('clean:js', function(cb) {
  del(['dist/*.js'], cb);
});

// and so on
相关问题