If you haven't used Grunt before, be sure to check out the Getting Started guide.
Once plugin has been installed include it in your Gruntfile.js
grunt.loadNpmTasks('grunt-nunjucks-2-html');
Task targets and options may be specified according to the grunt Configuring tasks guide.
nunjucks: {
options: {
data: grunt.file.readJSON('data.json'),
paths: 'templates'
},
render: {
files: {
'index.html' : 'index.html'
}
}
}
templates/index.html
(relative to the gruntfile) is now compiled with data.json
!
nunjucks: {
options: {
data: grunt.file.readJSON('data.json')
},
render: {
files: [
{
expand: true,
cwd: "bundles/",
src: "*.html",
dest: "build/",
ext: ".html"
}
]
}
You'll get a set of html files in build
folder.
Read JSON from file using grunt.file.readJSON
or specify object just inside your Gruntfile
.
You should specify a function to construct each data object for every of your templates. Execution context for the function would be a grunt file object. If you specify a data option it would be passed inside the function as an argument.
For instance, you could include name of the file inside an every data object
var path = require('path');
...
nunjucks: {
options: {
preprocessData: function(data) {
var page = path.basename(this.src[0], '.html');
var result = {
page: page,
data: data
};
return result;
},
data: grunt.file.readJSON('data.json')
},
render: {
files: [
{
expand: true,
cwd: "bundles/",
src: "*.html",
dest: "build/",
ext: ".html"
}
]
}
You could specify root path for your templates, paths
would be set for nunjucks' configure
Nice!