plugin to render contents using various template engines.
npm install --save-dev gulp-multi-renderer
gulpfile.js
var frontMatter = require('gulp-front-matter');
var marked = require('gulp-marked');
var renderer = require('gulp-multi-renderer');
gulp.src('./src/*.md')
.pipe(frontMatter({
remove: true
}))
.pipe(renderer({
target: "content"
}))
.pipe(marked())
.pipe(renderer({}))
.pipe(gulp.dest('./dist'));
});markdown with YAML front matter.
---
title: My Awesome Document
---
Hello, This is <%- frontMatter.title %>.
after pre-process.
Hello, This is My Awesome Document.
layout/default.ejs
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title><%= frontMatter.title %></title>
</head>
<body>
<%- contents %>
</body>
</html>after post-process.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>My Awesome Document</title>
</head>
<body>
<p>Hello, This is My Awesome Document.</p>
</body>
</html>Type: hash
Default: { target: "wrap", property: "forntMatter", templateDir: "./layouts"}
Type: String
Default: wrap
When content is specified, it render embedded template within file.contents. Default template is ejs. If you want to user mustache, set mustache to frontMatter.local.
When wrap is specified, you can refer file.contents through contents variable in the template file. Default template file is ./layouts/default.ejs. You can specify template file by frontMatter.layout.
You can also use mustache or jade for template file.
Type: String
Default: forntMatter
a Object name of which contains local variables.
Type: String
Default: ./layouts/
A directory in which template files are placed.