Question

我尝试过使用npm-concat，但它会从文件夹中汇总所有文件。但我的要求是这样的 -

我有一个名为＆＃34; header.html＆＃34;，＆＃34; footer.html＆＃34;我有一个名为view的文件夹，其中我有html的原始文本。

tpl
---- header.html
---- footer.html
view
---- view1.html
---- view2.html

现在我想将header.html添加到查看下的所有文件中，我想将footer.html附加到查看文件夹下的所有文件。我们如何才能实现这一目标？

Answer 1

我认为你最好考虑使用handlebars之类的模板引擎来完成这项任务，而不是连接文件。但是，自从你提问以来，我会尽力回答你的问题。

我不知道任何可以以最佳方式执行此操作的插件。但是，我编写了一个名为gulp-transform的插件，可以让你轻松地完成这项工作。

const gulp = require('gulp');
const transform = require('gulp-transform');
const readFileSync = require('fs').readFileSync;

const HEADER = readFileSync('tpl/header.html');
const FOOTER = readFileSync('tpl/footer.html');

gulp.task('html', () => {
  return gulp.src('view/*.html')
    .pipe(transform(contents => Buffer.concat([HEADER, contents, FOOTER])))
    .pipe(gulp.dest('dist'));
});

这有点难看，事实上我只建议在没有更好的选择时使用这个插件进行快速修复。一个更好的解决方案是定义一个完全符合这个要求的自定义插件。如果您认为它会有所帮助，我可以告诉您如何做到这一点。但这有点复杂。我认为你最好的选择是使用模板引擎。

npm使用gulp将静态文件连接到目录中的所有文件

1 个答案: