gulp-pluck
Learn more about gulp.js, the streaming build system
Gulp-pluck makes it so you can take a property from file and concatenate it into a single array/file. E.g.,
file1.data = {name: 'george'};
file2.data = {name: 'suzy'};Turns into:
file1.data;
// => [ {name: 'george'}, {name: 'suzy'} ]First, install gulp-pluck as a development dependency:
npm install --save-dev gulp-data
gulp-pluck takes two optional parameters:
propName which defaults to data. propName tells gulp-pluck which property to operate on.
fileName will give the file a new name. fileName defaults to the first file name to pass through the function.
Then, add it to your gulpfile.js:
var gulp = require('gulp')
var data = require('gulp-data')
var pluck = require('gulp-pluck')
var frontMatter = require('gulp-front-matter')
gulp.task('front-matter-to-json', function(){
return gulp.src('./posts/*.md')
.pipe(frontMatter({property: 'meta'}))
.pipe(data(function(file){
file.meta.path = file.path
}))
.pipe(pluck('meta', 'posts-metadata.json'))
.pipe(data(function(file){
file.contents = new Buffer(JSON.stringify(file.meta))
}))
.pipe(gulp.dest('dist'))
})The data flow would look something like this:
file1:
---
title: There's still hope for hoverboards
date: October 21, 2015
---
I'll hover convert your old road car into a skyway flyer!file2:
---
title: Finish it
date: 2500
---
Through that last dark cloud is a dying star. And soon enough, Xibalbia will die.
And when it explodes, it will be reborn. You will bloom...and I will live.frontMatter turns it into:
file1.meta
// => {
// title: "There's still hope for hoverboards"
// date: "October 21, 2015"
// }
file2.meta
// => {
// title: "Finish it"
// date: "2500"
// }data adds the file path:
file1.meta
// => {
// title: "There's still hope for hoverboards"
// date: "October 21, 2015"
// path: "/posts/2015-10-21-hoverboards.md"
// }
file2.meta
// => {
// title: "Finish it"
// date: "2500"
// path: "/posts/2500-finish_it.md"
// }pluck reduces it to a single file:
file1.meta // file1.path => "/posts/posts-metadata.json"
// => [{
// title: "There's still hope for hoverboards"
// date: "October 21, 2015"
// path: "/posts/2015-10-21-hoverboards.md"
// },
// {
// title: "Finish it"
// date: "2500"
// path: "/posts/2500-finish_it.md"
// }]data then throws the object into a JSON-style string in the contents property so it prints out as a JSON file.