Question

我在网上看过“运行顺序”＃39;将确保所有指定的任务将同步运行。出于某种原因，在我的情况下这不是真的。我错过了什么吗？

＆＃39; convertSassToCss＆＃39;是不能按预期工作的任务

如果我要执行任务＆＃39; cleanAllCss＆＃39;和＆＃39; convertSassToCss＆＃39;单独，它会工作。

这里的想法是首先从目录中删除所有css文件，然后将所有sass文件转换为css并将其放入已清理的目录

＆＃13;

/// <binding BeforeBuild='clean, min:css' Clean='clean' />
"use strict";

var gulp = require("gulp"),
  rimraf = require("rimraf"),
  concat = require("gulp-concat"),
  cssmin = require("gulp-cssmin"),
  uglify = require("gulp-uglify"),
  sass = require('gulp-sass'),
  rename = require('gulp-rename'),
  del = require('del'),
  runSequence = require('run-sequence');


var paths = {
    webroot: "./wwwroot/"
};

paths.cssPath = paths.webroot + "css/*.css";
paths.cssOutputPath = paths.webroot + "css";

//sass
paths.sassPath = paths.webroot + "sass/**/*.scss";
paths.sassOutputPath = paths.webroot + "./css/file";

gulp.task("cleanAllCss", function (cb) {
    console.log("2 -- Removing all CSS files");
    del([paths.cssOutputPath + "/*.css"], cb);
    console.log("2 -- DONE - Removed all css files");
});

gulp.task("convertSassToCss", function (cb) {
    console.log("3 -- Converting all SASS files into corresponding CSS");
    gulp.src(paths.sassPath)
        .pipe(sass())
        .pipe(gulp.dest(paths.cssOutputPath));
    console.log("3 -- DONE - Converting all SASS files into corresponding CSS");
});

//not working, should run in sequence
gulp.task("convertAllSassIntoCssMin", function (callback) {
    console.log("1 -- Converting all SASS files into corresponding min CSS files")
    runSequence('cleanAllCss', 'convertSassToCss', callback);
    console.log("1 -- DONE - Converting all SASS files into corresponding min CSS files")
});

＆＃13;

Answer 1

我无法与 run-sequence 说话，因为我之前没有使用它。

但是，您可以使用 Gulp 的任务依赖项功能按顺序运行任务，其中任务 NOT 运行，直到它的依赖项为止已经跑完了。

您的新任务签名

cleanAllCss 保持不变：

gulp.task("cleanAllCss", function (cb) { ... }
convertSassToCss 更改为：

gulp.task("convertSassToCss", ['cleanAllCss'], function (cb) { ... }
convertAllSassIntoCssMin 更改为：

gulp.task("convertAllSassIntoCssMin", ['convertSassToCss'], function (cb) { ... }

这可以确保convertAllSassIntoCssMin在convertSassToCss完成之前不会运行，而cleanAllCss在a*b完成之前一直无法运行。

参考gulp deps：

DEPS

类型：数组

在任务开始之前要执行和完成的一系列任务   运行

gulp.task（＆＃39; mytask＆＃39;，[＆＃39;阵列＆＃39;，＆＃39;＆＃39;，＆＃39;任务＆＃39;，＆＃39;名称＆＃ 39;]，function（）{
  // 做东西 }）;注意：您的任务是否在依赖项之前运行   完成了吗？确保您的依赖项任务正确使用   异步运行提示：接受回调或返回承诺或事件   流。

如果您只想运行捆绑包，也可以省略该功能   依赖任务：

gulp.task（＆＃39; build＆＃39;，[＆＃39; array＆＃39;，＆＃39; of＆＃39;，＆＃39; task＆＃39;，＆＃39; names＆＃ 39;]）;注意：任务   将并行运行（一次全部），所以不要承担任务   将按顺序开始/结束。

Answer 2

问题出在cleanAllCss任务中。 del 接受的第二个参数是options，而不是您尝试传递的回调。永远不会执行回调。删除完成后尝试手动运行。

gulp.task("cleanAllCss", function (cb) {
    console.log("2 -- Removing all CSS files");
    del([paths.cssOutputPath + "/*.css"]).then(paths => {
        console.log("2 -- DONE - Removed all css files");
        cb();
    };

});

在gulp中同步执行任务

2 个答案: