node.js - 将 Gulp 任务组合成一个 gulp-rev list

Question

刚刚开始使用 Gulp - 它非常棒。这行得通，但 rev.manifest 覆盖了自己，并且其中没有“样式”和“脚本”。一定会有更好的办法。正确的？ :-)

gulp.task('script', function() {
  var scripts = gulp.src('source-js/main.js')
                  .pipe(uglify())
                  .pipe(rev())
                  .pipe(gulp.dest());

  var manifest = gulp.src('./rev-manifest.json');

  return es.merge(scripts, manifest)
           .pipe(rev.manifest())
           .pipe(gulp.dest('.'))
});

gulp.task('style', function() {
  var styles = gulp.src('source-less/style.less')
                  .pipe(less({compress: true}))
                  .pipe(rev())
                  .pipe(gulp.dest());

  var manifest = gulp.src('./rev-manifest.json');

  return es.merge(styles, manifest)
           .pipe(rev.manifest())
           .pipe(gulp.dest('.'))
});

gulp.task('watch', function () {
    gulp.watch('source-less/**/*.less', ['style']);
    gulp.watch('source-js/**.js', ['script']);
});

编辑:尝试使用 es 仍然是编写 list 的爱好者:

gulp.task('script', function() {

  var scripts = gulp.src('source-js/main.js')
                  .pipe(uglify())
                  .pipe(rev())
                  .pipe(gulp.dest('assets/js'));

  var manifest = gulp.src('./rev-manifest.json');

  return es.merge(scripts, manifest)
           .pipe(rev.manifest())
           .pipe(gulp.dest('.'))
});

gulp.task('style', function() {

  var styles = gulp.src('source-less/style.less')
                  .pipe(less({compress: true}))
                  .pipe(rev())
                  .pipe(gulp.dest('assets/css'));

  var manifest = gulp.src('./rev-manifest.json');

  return es.merge(styles, manifest)
           .pipe(rev.manifest())
           .pipe(gulp.dest('.'))
});

Answer 1

有一个示例可以将 manifest.json 直接添加到流中以防止它被覆盖，但目前有一个错误 gulp#396与vinyl-fs#25有关那不允许它。对于修复后的 future 读者:

gulp.task('scripts', function() {
  gulp.src('source-js/main.js')
    .pipe(uglify())
    .pipe(rev())
    .pipe(gulp.dest('assets/js'))
    .pipe(gulp.src('./rev-manifest.json'))
    .pipe(rev.manifest())
    .pipe(gulp.dest('assets'));
});

但是现在，您应该使用 event-stream 为此。请注意，直到 gulp-rev#59合并了，就不行了。

var es = require('event-stream');

gulp.task('scripts', function() {
  var scripts = gulp.src('source-js/main.js')
                  .pipe(uglify())
                  .pipe(rev())
                  .pipe(gulp.dest('assets/js'));

  var manifest = gulp.src('./rev-manifest.json');

  return es.merge(scripts, manifest)
           .pipe(rev.manifest())
           .pipe(gulp.dest('.'))
});

您的样式 任务将遵循相同的模式。所有这些都假定您的 manifest.json 将位于 root 目录中。