Installation¶

Pug is available vianpm:

$ npm install pug

Overview¶

The general rendering process of Pug is simple.pug.compile() will compile the Pug source code into a JavaScript function that takes a data object (called “locals”) as an argument. Call that resultant function with your data, andvoilà!, it will return a string of HTML rendered with your data.

The compiled function can be re-used, and called with different sets of data.

//- template.pugp #{name}'s Pug source code!

constpug=require('pug');// Compile the source codeconstcompiledFunction=pug.compileFile('template.pug');// Render a set of dataconsole.log(compiledFunction({name:'Timothy'}));// "<p>Timothy's Pug source code!</p>"// Render another set of dataconsole.log(compiledFunction({name:'Forbes'}));// "<p>Forbes's Pug source code!</p>"

Pug also provides thepug.render() family of functions that combine compiling and rendering into one step. However, the template function will be re-compiled every timerender is called, which might impact performance. Alternatively, you can use thecache option withrender, which will automatically store the compiled function into an internal cache.

constpug=require('pug');// Compile template.pug, and render a set of dataconsole.log(pug.renderFile('template.pug', {name:'Timothy'}));// "<p>Timothy's Pug source code!</p>"