在 Express.js 中，模板引擎是一个重要的方面，它使得实现动态页面变得更加容易。Pug 是 Express.js 中最常用的模板引擎之一，但是有时候你可能需要考虑替代它。在这篇文章中，我们将讨论如何使用 EJS 替代 Pug，并提供一些示例代码，以便更好地帮助你理解这个过程。
EJS 简介
EJS 是一种简单的模板语言，它允许你使用 JavaScript 代码在 HTML 中插入动态内容。与 Pug 不同，EJS 不需要你掌握新的语法和方法。你可以在 EJS 中使用任何你已经熟悉的约定和语法，这是因为 EJS 在解析时会将你的代码作为 JavaScript 来处理。
安装 EJS
在使用 EJS 之前，你需要先安装它。你可以在 npm 上找到 EJS，并使用以下命令进行安装：
--- ------- --- ------
然后，在你的 Express.js 应用程序中，你需要将 EJS 导入为模板引擎：
----- ------- - ------------------- ----- --- - --------------- ----- --- - ---------- ---------------- --------- - ---------- ------------- -------- ------- ------------ ----- ---- -- - ------------------- - ------ ------ -------- ------ ----- --- --- ---------------- -- -- - -------------------- ------ --------- -- ---- ------- ---
这个例子介绍了如何安装和使用 EJS。我们在应用程序中定义了视图引擎为 EJS，并在路由处理程序中将 index.ejs 渲染为响应。在渲染过程中，我们将一个对象传递给模板引擎，这个对象包含渲染模板所需的变量。
使用 EJS 替代 Pug
接下来，我们将展示如何使用 EJS 代替 Pug。我们将使用示例模板来说明这个过程：
Pug 模板
----
----
------ -----
----
--- -------EJS 模板
------
------
---------- ----- ----------
-------
------
------- ------- -------
-------
-------可以看到，EJS 模板看起来非常像普通的 HTML 文件。但是，注意到在 EJS 模板中我们使用了 <%= %> 语法，表示我们要将 JavaScript 表达式的结果作为 HTML 输出。这些表达式可以是变量、函数调用或表达式。
在 Express.js 应用程序中，我们可以按照之前的例子来使用 EJS 模板。唯一的区别是模板的扩展名是 .ejs，而不是 .pug：
----- ------- - ------------------- ----- --- - --------------- ----- --- - ---------- ---------------- --------- - ---------- ------------- -------- ------- ------------ ----- ---- -- - ------------------- - ------ ------ -------- ------ ----- --- --- ---------------- -- -- - -------------------- ------ --------- -- ---- ------- ---
在这个例子中，我们使用了渲染 index.ejs 模板的代码。注意到，我们将同样的数据对象 { title: 'EJS', message: 'Hello EJS!' } 传递到模板引擎。
总结
在本文中，我们详细介绍了如何使用 EJS 替换 Pug 作为 Express.js 的模板引擎。我们展示了如何安装 EJS、如何在 Express.js 应用程序中使用 EJS，以及如何使用 EJS 模板替换现有的 Pug 模板。通过这篇文章，你应该已经了解了使用 EJS 的基础知识，并可以将这些技术应用到你的实际项目中。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64769e70968c7c53b0348322