- 资料简介
- 学员评分
Pug 是一种 HTML 模板语言。
安装
Pug 可通过npm 获得:
$ npm install pug
概览
Pug 的一般渲染过程很简单。pug.compile()将 Pug 源代码编译成一个 JavaScript 函数,该函数接受一个数据对象(称为“ locals”)作为参数。用你的数据调用这个结果函数,瞧!,它将返回一串用您的数据呈现的 HTML。
编译后的函数可以重复使用,并使用不同的数据集调用。
//- template.pug
p #{name}'s Pug source code!
const pug = require('pug');
// Compile the source code
const compiledFunction = pug.compileFile('template.pug');
// Render a set of data
console.log(compiledFunction({
name: 'Timothy'
}));
// "<p>Timothy's Pug source code!</p>"
// Render another set of data
console.log(compiledFunction({
name: 'Forbes'
}));
// "<p>Forbes's Pug source code!</p>"
Pug 还提供了pug.render()一系列将编译和渲染合二为一的函数。但是,每次render调用模板函数时都会重新编译,这可能会影响性能。或者,您可以使用cachewith 选项render,它会自动将编译后的函数存储到内部缓存中。
const pug = require('pug');
// Compile template.pug, and render a set of data
console.log(pug.renderFile('template.pug', {
name: 'Timothy'
}));
// "<p>Timothy's Pug source code!</p>"