Question

我有一个简单的gulp脚本。流程是：

删除dist文件夹
将.html和.css文件移至新的dist文件夹
编译打字稿并将生成的.js移动到dist文件夹
模仿.js
将.js和.css注入.html

问题是如果我第一次删除dist文件夹，注入只适用于.js文件。但是，如果我跳过dist文件夹的清理，它会创建一个正确的.html（如同..html中的.js和.css一样）。有没有人遇到过这个问题？如果是这样，你是如何修复它的？我猜它与流水线有关。

Gulp版本：“^ 3.9.1”

var gulp = require('gulp');
var ts = require('gulp-typescript');
var minify = require('gulp-minify');
var inject = require('gulp-inject');
var del = require('del');

gulp.task('default', ['clean'], function () {
    gulp.start('scripts')
});

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

gulp.task('move', function () {
    console.log('-- gulp is running task "move"');
    gulp.src(['app/**/*.html', 'app/**/*.css'])
        .pipe(gulp.dest('dist'));
});

gulp.task('compile', ['move'], function () {
    console.log('-- gulp is running task "compile"');
    return gulp.src('app/**/*.ts')
        .pipe(ts({
            noImplicitAny: true,
            out: 'app.js'
        }))
        .pipe(gulp.dest('dist'));
});

gulp.task('compress', ['compile'], function () {
    console.log('-- gulp is running task "compress"');
    gulp.src('dist/**/*.js')
        .pipe(minify({
            ext: {
                src: '-debug.js',
                min: '.js'
            },
            noSource: true
        }))
        .pipe(gulp.dest('dist'))
});


gulp.task('scripts', ['compress'], function () {
    console.log('-- gulp is running task "scripts"');
    var target = gulp.src('dist/index.html');
    var sources = gulp.src(['dist/**/*.js', 'dist/**/*.css'], {read: false});
    return target.pipe(inject(sources, {relative: true}))
        .pipe(gulp.dest('dist'));
});

Answer 1

你正在遇到竞争条件，因为你在几个地方没有正确地发出async completion的信号：

del不接受回调cb，它会返回Promise。你需要从任务中返回Promise：

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

Streams也需要从您的任务中返回。您在move和compress任务中没有这样做，这些任务（除其他外）意味着gulp-inject可能会在所有.css个文件被复制到{{{{}}之前运行1}}。

dist/

如果首先清除dist文件夹，Gulp注入会忽略css

1 个答案: