在前端开发中，模板引擎是一个非常重要的技术。它可以帮助我们快速构建出符合需求的页面，同时也提高了代码的可维护性和复用性。在 Node.js 的世界中，Express.js 是最流行的 Web 框架之一。而 Pug 则是一个简洁、高效的模板引擎，它可以让我们在 Express.js 应用程序中轻松地构建出各种复杂的页面。
本文将介绍如何在 Express.js 应用程序中使用 Pug 模板引擎，并提供详细的示例代码和指导意义。
安装和配置 Pug
首先，我们需要在 Express.js 应用程序中安装和配置 Pug 模板引擎。可以通过以下命令进行安装：
npm install pug --save
然后，在 Express.js 应用程序中进行配置。可以在 app.js 文件中添加以下代码：
const express = require('express');
const app = express();
app.set('view engine', 'pug');
app.set('views', __dirname + '/views');这段代码中，我们通过 set 方法来设置了 Pug 的两个参数。其中，view engine 参数指定了使用 Pug 作为模板引擎；views 参数则指定了模板文件所在的目录。
创建 Pug 模板文件
接下来，我们需要创建 Pug 模板文件。在 Express.js 应用程序中，可以将模板文件放在 views 目录下，文件名以 .pug 结尾。下面是一个简单的示例：
html
head
title= title
body
h1= message这段代码表示一个简单的 HTML 页面，其中 title 和 message 是变量，可以在渲染模板时进行替换。
渲染 Pug 模板文件
最后，在 Express.js 应用程序中渲染 Pug 模板文件。可以通过以下代码来完成：
app.get('/', (req, res) => {
res.render('index', { title: 'Express', message: 'Welcome to Express' });
});这段代码中，我们使用 render 方法来渲染 views/index.pug 文件。同时，我们传递了一个对象作为第二个参数，其中包含了 title 和 message 两个变量的值。
总结
本文介绍了如何在 Express.js 应用程序中使用 Pug 模板引擎。通过安装和配置 Pug，创建 Pug 模板文件，以及渲染 Pug 模板文件，我们可以轻松地构建出各种复杂的页面。同时，本文还提供了详细的示例代码和指导意义，帮助读者更好地理解和掌握这一技术。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65eecb242b3ccec22f7c2367