Gathering detailed insights and metrics for gulp-nunjucks-md
Gathering detailed insights and metrics for gulp-nunjucks-md
Installations
npm install gulp-nunjucks-mdDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Min. Node Version
>=6
Node Version
10.13.0
NPM Version
6.4.1
Releases
Unable to fetch releases
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
Maintainers
1
Package Meta Information
Latest Version
2.3.2
Package Id
gulp-nunjucks-md@2.3.2
Unpacked Size
32.66 kB
Size
8.65 kB
File Count
40
NPM Version
6.4.1
Node Version
10.13.0
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
gulp-nunjucks-md
Render nunjucks templates, with markdown and front-matter.
Install
Install with npm
npm install --save-dev gulp-nunjucks-md
Features
This plugin renders nunjucks to html and performs following tasks additionally –
- If front-matter is found, extracts front-matter data and assigns to a
pagevariable. - If file is markdown and have frontmatter, renders markdown with marked.
For a CLI tool, see njk. For compiling/precompiling, see gulp-nunjucks
Configuration
- To extend a parent layout with frontmatter, your page should have a front-matter with a
layoutpointing to name of a layout (without extension) in your template directory. - To set a parent layout for all pages, data passed to plugin should contain a
page.layoutproperty which points to the name of the layout without extension. - By default this plugin warps a
contentblock around your page. Your parent layout should have acontentblock where processed content will be inserted. You can turn off this behavior by settinguseBlock: falseeither in plugin options or in front-matter and declaring blocks normally ( for example, multiple block inheritance). - In order to render markdown, the page should have
.markdownor.mdextension, You can also pass custom options to marked throughmarkedoption. - Be aware that combining markdown with nunjucks can lead to undesired output. By setting
escape: falseyou can unescape markdown before processing nunjucks to make nunjucks tags work.
Usage
1const gulp = require('gulp') 2const nunjucksMd = require('gulp-nunjucks-md') 3 4gulp.task('default', function() { 5 return gulp 6 .src('src/*.{html,njk,md}') // your pages 7 .pipe( 8 nunjucksMd({ 9 path: ['src/templates/'], // nunjucks templates 10 data: 'src/data.json' // json data 11 }) 12 ) 13 .pipe(gulp.dest('dist')) 14})
API
Plugin accepts options object, which contain these by default:
1var defaults = { 2 path: '.', 3 ext: '.html', 4 extLayout: '.njk', 5 data: {}, 6 useBlock: true, 7 block: 'content', 8 marked: null, 9 escape: true, 10 inheritExtension: false, 11 envOptions: { 12 watch: false 13 }, 14 manageEnv: null 15}
path- Relative path to templatesext- Extension for compiled templates, pass null or empty string if yo don't want any extensionextLayout- Extension for the layouts to be extendeddata- Data passed to template, either object or path to the json fileuseBlock- If true appends a content block. If false only parent template will be extended and no default content block will be wrapped. We can also set it at page level by addinguseBlock : false/trueto frontmatter. Please note that page level configuration will be preferred.block- Name of content block in your parent templatemarked- Custom options for markedescape-trueby default. Set it tofalseif you want to use nunjucks in markdown.inheritExtension- If true, uses same extension that is used for templateenvOptions- These are options provided for nunjucks Environment. More info here.manageEnv- Hook for managing environment before compilation. Useful for adding custom filters, globals, etc.
For more info about nunjucks functionality, check https://mozilla.github.io/nunjucks/api.html.
Example
Here is an example of using gulp-nunjucks md —
Although this example conatains a html with front-matter and nunjucks, you can use markdown as well. Now, suppose we have a file named src/templates/default.njk for parent template.
1<!DOCTYPE html> 2<html lang="en-US"> 3 <head> 4 <meta charset="utf-8"> 5 <title>{{ site.title }} | {{ page.title }}</title> 6 <meta name="description" content="{{ page.description }}" /> 7 <link rel="stylesheet" href="{{ site.url }}/main.css"> 8 </head> 9 <body> 10 <main> 11 {% block content %}{% endblock %} <!-- Important --> 12 <main> 13 <script async src="{{ site.url }}/main.js"></script> 14 </body> 15</html>
And we have a json file at src/data.json
1{ 2 "site": { 3 "title": "Example Site", 4 "url": "http://example.com" 5 }, 6 "boxes": [ 7 { 8 "title": "red" 9 }, 10 { 11 "title": "green" 12 }, 13 { 14 "title": "blue" 15 } 16 ] 17}
Also we have a html page with some nunjucks and front-matter in it src/index.html.
1--- 2layout: default 3title: "Page Title" 4description: "Some Awesome Description" 5--- 6 7{% for box in boxes %} 8 9<div class="{{ box.title }}"> 10</div> 11{% endfor %}
Now in our gulpfile.js.
1var gulp = require('gulp') 2var nunjucksMd = require('gulp-nunjucks-md') 3 4gulp.task('default', function() { 5 return gulp 6 .src('src/*.html') 7 .pipe( 8 nunjucksMd({ 9 path: ['src/templates/'], 10 data: 'src/data.json' 11 }) 12 ) 13 .pipe(gulp.dest('dist')) 14})
This will render to
1<!DOCTYPE html> 2<html lang="en-US"> 3 <head> 4 <meta charset="utf-8"> 5 <title>Example Site | Page Title</title> 6 <meta name="description" content="Some Awesome Description" /> 7 <link rel="stylesheet" href="http://example.com/main.css"> 8 </head> 9 <body> 10 <main> 11 <div class="red"> 12 </div> 13 <div class="green"> 14 </div> 15 <div class="blue"> 16 </div> 17 <main> 18 <script async src="http://example.com/main.js"></script> 19 </body> 20</html>
Shout-outs
Carlos G. Limardo and Kristijan Husak for gulp-nunjucks-render from which this plugin is derived. Sindre Sorhus for gulp-nunjucks
No vulnerabilities found.
No security vulnerabilities found.