npm-concatを使用しようとしましたが、フォルダからすべてのファイルを連結します。私の要件は、このようなものですnpm gulpを使用してディレクトリ内のすべてのファイルに静的ファイルを連結します。
私は "header.html"、 "footer.html"と呼ばれる1つのファイルがあり、私はhtmlの生のテキストを持っているビューと呼ばれるフォルダを持っています。
tpl
---- header.html
---- footer.html
view
---- view1.html
---- view2.html
は、今私は、ビューの下のすべてのファイルにheader.htmlを付加したいと私は、ビューのフォルダの下のすべてのファイルにfooter.htmlを追加します。私たちはこれをどのように達成できますか？
ファイルを連結するのではなく、このタスクを実行するために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'));
});
これは少し醜いですが、実際には、このプラグインを使用することをお勧めします。より良い解決策は、これを正確に行うカスタムプラグインを定義することです。それが参考になると思うなら、私はあなたがそれをどうやって行うのかを示すことができます。これはもう少し複雑です。私は本当にあなたの最良の選択肢は、テンプレートエンジンを使用することだと思う。