如何在 gulp 中连接页眉、页脚和内容文件列表？

Question

我正在制作一个带有头文件、页脚文件和内容文件列表的 html 生成器。我有文件夹结构部分/内容。在 partials 文件夹中是页眉和页脚，在 partials/contents 中是 index.html、about-us.html 等文件。在这些内容文件中，我想添加页眉和页脚。所以基本上，我想通过在内容文件夹中循环作为我的内容来连接文件，并添加页眉/页脚文件，然后在不同的文件夹中输出。我该如何做到这一点？或者您可以建议一个文件夹结构来轻松实现此目的。

在这里，我只在内容文件夹中对单个文件执行 gulp 任务：

gulp.task('html-test', ['clean-html-test'], function() {
  var header = './partials/header.html';
  var body = './partials/contents/_test.html';
  var footer = './partials/footer.html';
  var outputFilename = 'test.html';

  log('Generating public/test.html...');

  return gulp.src([header, body, footer])
    .pipe($.concat(outputFilename))
    .pipe(gulp.dest('./public/'));
});

那么，我怎样才能在内容文件夹中自动循环呢？谢谢。

Answer 1

找到了一个解决方案，一个名为 gulp-headerfooter 的 gulp 插件。刚刚测试过，效果很好！

gulp.task('html-gen', function () {
  log('Generating html files...');
  gulp.src('./partials/content/*.html')
    .pipe($.headerfooter.header('./partials/_header.html'))
    .pipe($.headerfooter.footer('./partials/_footer.html'))
    .pipe(gulp.dest('./public/'));
});