Express.js 模板引擎

什么是模板引擎

模板引擎方便您在应用程序中使用静态模板文件。 在运行时，它将模板文件中的变量替换为实际值，并将模板转换为发送到客户端的 HTML 文件。 因此，这种方法是首选的，可以轻松设计 HTML 页面。

以下是与 Express.js 配合使用的一些流行的模板引擎的列表

• Pug（以前称为 jade）
• mustache
• dust
• atpl
• eco
• ect
• ejs
• haml
• haml-coffee
• handlebars
• hogan
• jazz
• jqtpl
• JUST
• liquor
• QEJS
• swig
• templayed
• toffee
• underscore
• walrus
• whiskers

在上面的模板引擎中，pug（以前称为 jade）和 mustache 似乎是最受欢迎的选择。 Pug 类似于 Haml，它使用空格。 根据 template-benchmark，pug 比 Handlebars、EJS、Underscore 慢 2 倍。 ECT 似乎是最快的。 许多程序员喜欢 mustache 模板引擎，主要是因为它是最简单和通用的模板引擎之一。

将模板引擎与 Express 结合使用

模板引擎使您能够在应用程序中使用静态模板文件。 要呈现模板文件，您必须设置以下应用程序设置属性

例如： app.set('views', './views')。

• Views: 它指定模板文件所在的目录。
• view engine: 它指定您使用的模板引擎。 例如，要使用 Pug 模板引擎：app.set('view engine', 'pug')。

让我们以模板引擎 pug（以前称为 jade）为例。

Pug 模板引擎

让我们学习如何在 Node.js 应用程序中使用 Express.js 使用 pug 模板引擎。 Pug 是 Node.js 的模板引擎。 Pug 使用空格和缩进作为语法的一部分。 它的语法很容易学习。

安装 pug

执行以下命令安装 pug 模板引擎

Pug 模板必须写在 .pug 文件中，所有 .pug 文件必须放在 Node.js 应用程序根文件夹中的 views 文件夹中。

注意： 默认情况下，Express.js 在根文件夹下的 views 文件夹中搜索所有视图。 您还可以使用 express 中的 views 属性将其设置为另一个文件夹。 例如：app.set('views','MyViews')。

pug 模板引擎以简单的方式获取输入，并以 HTML 格式生成输出。 看看它是如何渲染 HTML 的

简单输入

pug 模板生成的输出

Express.js 可以与任何模板引擎一起使用。 让我们举一个例子来说明 pug 模板如何动态创建 HTML 页面。

请看这个例子

在 views 文件夹中创建一个名为 index.pug 的文件，并在其中写入以下 pug 模板

文件：server.js