Gulp 任务没有按预期工作

Question

我有 2 个任务：

whitelabel - 我有一个 gulp 任务将给定的 whitelabel 项目复制到文件夹中
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']);
});

Answer 1

您的原始默认任务不保证这些任务运行以任何特定顺序排列 - 事实上它们运行是并行的。

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

或者您可以通过

使 'whitelabel' 任务成为 sass 任务的依赖项

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

Gulp 任务没有按预期工作

Gulp task not working as expected

javascript

sass

gulp

gulp-sass

gulp-watch

白标任务

SASS 任务

默认任务