在Web开发中，模板渲染是一个必不可少的环节。Nunjucks是一个高效的JavaScript模板引擎包，它与Node.js和浏览器兼容，并且非常易于使用。
安装Nunjucks
为了使用Nunjucks，您需要先安装它。您可以通过npm来安装它：
npm install nunjucks
使用Nunjucks
要使用 Nunjucks 渲染模板，您需要完成以下三个步骤。
第一步：加载模板
要加载Nunjucks模板，请使用以下代码：
const nunjucks = require('nunjucks');
nunjucks.configure('views', { autoescape: true });这里 views 是您存放模板文件（通常是 .html）的位置。 autoescape 选项用于自动转义HTML字符。
第二步：编写模板
下面是一个简单的Nunjucks模板示例：
-- -------------------- ---- -------
--------- -----
------
------
--------- ----- ----------
-------
------
------ ------- -------
-------
-------在这个模板中，我们使用了{{ }}表达式来显示变量。 在这个例子中，我们显示了两个变量 - title 和 message。
第三步：渲染模板
现在我们已经创建了一个模板并设置好了Nunjucks，让我们来看看如何在Web应用程序中使用它来渲染HTML。
app.get('/', function(req, res) {
const data = {
title: 'Nunjucks Tutorial',
message: 'Welcome to Nunjucks tutorial'
};
res.render('index.html', data);
});在这个例子中，我们将模板文件名传递给 res.render() 方法，并在该方法的第二个参数中传递了一个包含变量数据的对象（data）。
进阶：使用 Nunjucks 扩展
除了基本的模板渲染功能，Nunjucks还支持许多高级特性。以下是一些最常用的扩展：
继承
继承是构建大型Web应用程序时非常有用的概念。它可以帮助您组织代码并减少重复。
要实现继承，请使用以下代码：
{% extends "base.html" %}
{% block content %}
<p>This is the content of the child template.</p>
{% endblock %}在这个例子中，我们从 base.html 模板中继承，并覆盖 content 块。
包含
如果您需要在多个页面中重复使用相同的代码块，则可以使用 include 语句来避免重复的代码。
要使用 include ，请使用以下代码：
{% include "header.html" %}在这个例子中，我们将 header.html 文件包含在模板中。
过滤器
过滤器是在显示变量之前修改它们的值的函数。您可以使用内置的过滤器或定义自己的过滤器。
要使用过滤器，请使用以下代码：
{{ variable | filter }}在这个例子中，变量 variable 的值将通过名为 filter 的过滤器进行处理。
以下是一个使用内置过滤器的例子：
{{ message | capitalize }}在这个例子中，过滤器 capitalize 将 message 变量的值转换为大写字母。
结论
Nunjucks是一个强大而易于使用的模板引擎，特别适用于Node.js和浏览器环境。通过本文，您已经了解了基本的Nunjucks使用方法，并学习了一些高级功能。希
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/32933
