как запустить задачу gulp из двух или более других задач и передать канал через

Это должно быть очевидно, но я не могу найти. Я хочу предварительно обработать файлы стилуса/кофе с помощью наблюдателя в среде разработки и в рабочей среде с задачей сборки (разве это не общее для всех нас?), а также выполнить еще несколько шагов минимизации и сокращения в рабочей среде, но я хочу чтобы поделиться общими шагами как для разработки, так и для производства для DRY

Проблема в том, что когда я запускаю задачу, которая просматривает файлы, задача, которая выполняет предварительную обработку, делает это со всеми файлами, поскольку у нее есть собственный оператор gulp.src, который включает все файлы стилуса.

Как избежать компиляции всех файлов при просмотре, сохраняя при этом отдельную задачу компиляции. Спасибо

paths = {
    jade: ['www/**/*.jade']
  };

  gulp.task('jade', function() {
    return gulp.src(paths.jade).pipe(jade({
      pretty: true
    })).pipe(gulp.dest('www/')).pipe(browserSync.stream());
  });



 gulp.task('serve', ['jade', 'coffee'], function() {
    browserSync.init({
      server: './www'
    });
    watch(paths.jade, function() {
      return gulp.start(['jade']);
    });
    return gulp.watch('www/**/*.coffee', ['coffee']);
  });

gulp gulp-watch
person eskhool    schedule 14.09.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Одна важная вещь в Gulp — не дублировать конвейеры. Если вы хотите обрабатывать файлы стилуса, это должна быть единственная трубка стилуса. Однако, если вы хотите выполнить разные шаги в своем канале, у вас есть несколько вариантов. Я бы предложил использовать функцию noop() в сочетании с функцией выбора:

var through = require('through2'); // Gulp's stream engine

/** creates an empty pipeline step **/
function noop() {
  return through.obj();
}

/** the isProd variable denotes if we are in
  production mode. If so, we execute the task.
  If not, we pass it through an empty step
  **/
function prod(task) {
  if(isProd) {
    return task;
  } else {
    return noop();
  }
}

gulp.task('stylus', function() {
  return gulp.src(path.styles)
    .pipe(stylus())
    .pipe(prod(minifyCss())) // We just minify in production mode
    .pipe(gulp.dest(path.whatever))
})

Что касается инкрементных сборок (построение только измененных файлов с каждой итерацией), лучшим способом будет использовать плагин gulp-cached:

var cached = require('gulp-cached');

gulp.task('stylus', function() {
  return gulp.src(path.styles)
    .pipe(cached('styles')) // we just pass through the files that have changed
    .pipe(stylus())
    .pipe(prod(minifyCss()))
    .pipe(gulp.dest(path.whatever))
})

Этот плагин будет проверять, изменилось ли содержимое с каждой выполненной вами итерацией.

Я посвящаю целую главу Gulp для различных сред в моя книга, и я нашел их наиболее подходящими. Для получения дополнительной информации об инкрементных сборках вы также можете проверить мою статью об этом (включая Gulp4): http://fettblog.eu/gulp-4-incremental-builds/

person ddprrt    schedule 14.09.2015
comment
Ваш ответ работает, поэтому я, скорее всего, приму его. Однако кешированный плагин не требуется? После просмотра файла, если я запускаю задачу, мне не нужно снова предоставлять src? Почему это в gulp... любое объяснение будет приветствоваться и спасибо за ваш ответ - person eskhool; 15.09.2015
comment
Задачи Gulp обычно не имеют состояния и, так сказать, глупы. Поэтому обычно наблюдатель и файлы не знают друг о друге. Это также позволяет вам просматривать определенные файлы и впоследствии делать что-то совершенно не связанное с ними. Также: Наблюдатель за файлами просто ищет изменения и не читает их содержимое. Вот для чего нужен вызов gulp.src. В будущем вам не придется использовать кеши благодаря встроенной функции gulp.lastRun(). - person ddprrt; 15.09.2015