Gulp 任务未按预期工作答案

【问题标题】：Gulp task not working as expectedGulp 任务未按预期工作
【发布时间】：2017-05-24 01:05:24
【问题描述】：

我有 2 个任务：

whitelabel - 我有一个 gulp 任务，将给定的 whitelabel 项目复制到一个文件夹中
sass - 在该文件夹中编译 sass 项目

我的问题是，当我让它们在我的默认任务上按顺序运行时，css 文件被复制，但 sass 任务没有生成它应该生成的 css。但是，如果我运行一个任务而不是另一个任务，则会生成 css 文件。

我错过了什么？

白标任务

gulp.task('whitelabel', function() {
    var argv = yargs.argv;
    if (argv.whitelabel){
      gulp.src('./whitelabels/_template/**/*')
      .pipe(gulp.dest('./assets'));
      return gulp.src('./whitelabels/'+ argv.whitelabel +'/**/*')
      .pipe(gulp.dest('.'));
    } else {
      return gulp.src('./whitelabels/_template/**/*')
      .pipe(del.sync(['./assets/']))
      .pipe(gulp.dest('.'));
    }
});

SASS 任务

gulp.task('sass', function() {
  return gulp.src('assets/styles/style.scss')
    .pipe($.sourcemaps.init())
    .pipe($.sass({
      style: 'expanded'
    }))
    .on('error', $.notify.onError({
      title: 'SASS Failed',
      message: 'Error(s) occurred during compile!'
    }))
    .pipe($.sourcemaps.write())
    .pipe(gulp.dest('assets/styles'))
    .pipe(reload({
      stream: true
    }))
    .pipe($.notify({
      message: 'Styles task complete'
    }));
});

默认任务

gulp.task('default', ['config', 'browser-sync', 'whitelabel', 'sass', 'minify-css'], function() {
  gulp.watch('whitelabels/_template/assets/styles/*.css', function(file) {
    if (file.type === "changed") {
      reload(file.path);
    }
  });
  gulp.watch(['*.html', 'app/**/*.html', 'views/*.html'], ['bs-reload']);
  gulp.watch(['whitelabels/_template/assets/js/*.js'], ['whitelabel','bs-reload']);
  gulp.watch(['app/*.js'], ['bs-reload']);
  gulp.watch('whitelabels/_template/assets/styles/**/*.scss', ['whitelabel', 'sass', 'minify-css']);
});

【问题讨论】：

您是假设还是需要在“sass”任务之前完成“whitelabel”？因为它可能会也可能不会，所以它们不是按顺序运行的。
是的，我假设。它应该在序列中的所有其他任务之前完成。我该怎么做？

标签： javascript sass gulp gulp-watch gulp-sass

【解决方案1】：

您最初的默认任务不保证任务以任何特定顺序运行 - 实际上它们是并行运行的。

许多人使用 run-sequence https://www.npmjs.com/package/run-sequence 以指定的顺序运行任务。

或者您可以通过

使“whitelabel”任务成为 sass 任务的依赖项

gulp.task('sass', ['whitelabel'], function() {

【讨论】：

感谢您的帮助！