CODEWITHSUNDEEP
jsongulpnunjucks
DrDrakken
DrDrakken

Reputation: 47

Using includeData Tag with nunjucks templating

I am using the automated workflow with gulp to build html and css from nunjucks templates based on this: https://github.com/uxmoon/automate-workflow

And I now want to include json data stored in files to access them in my components. There is a plugin called "includeData" that should do the trick: https://github.com/VincentLeung/nunjucks-includeData

I tried to include this into the process, but it does not work.

What I did so far:

I added a file called "nunjucks-includedata.js" into the tasks folder where the gulp tasks are located.

var nunjucks = require('nunjucks'),
    includeData = require('nunjucks-includeData'),
    gulpnunjucks = require('gulp-nunjucks');

var templates = 'app/templates'; //Set this as the folder that contains your nunjuck files

var env = new nunjucks.Environment(new nunjucks.FileSystemLoader(templates));
includeData.install(env);
gulp.task('pages', function() {
    // Gets .html files. see file layout at bottom
    return gulp.src([templates + '/*.html', templates + '/**/*.html'])
        // Renders template with nunjucks and marked
        .pipe(gulpnunjucks.compile("", {env: env}))
        // output files in dist folder
        .pipe(gulp.dest(dist))
});

But it does not work. I get an error when starting gulp, that the tag "includeData" is not recognized.

There is of course something missing but I have no idea what it is and I also did not find anything useful when searching the internet.

Hopefully someone is already using the includeData plugin sucessfully in his build process and can tell me what I have to change in the configuration.

Thank you very much in advance for any help!

best regards, Thomas

Upvotes: 0

Views: 482

Answers (1)

Aikon Mogwai
Aikon Mogwai

Reputation: 5225

At first you must check that extension installed

// test.json
{"name": "Bill"}

// your-app.js
...
includeData.install(env);
var res = res.renderString('{% includeData "test.json" %} {{name}}');
console.log(res); // Bill

This extension don't work on Node 5.x, because require destructuring assignment (see node_modules\nunjucks-includeData\index.js, line 78). Perhaps, you must update your Node.

Upvotes: 0

Related Questions