如何在 Express.js 中使用模板引擎?

Express.js 是 Node.js 中一个流行的 Web 框架,它简化了构建 Web 应用程序的过程。Express 的主要特性之一是它能够与模板引擎集成,允许开发者利用服务器的数据动态生成 HTML 页面。在本文中,我们将探讨如何在 Express 中使用模板引擎,并提供一份适合初学者遵循的分步指南。

前置条件:

使用 Express 实现模板引擎的步骤:

第一步: 安装 Express 和模板引擎

npm install express ejs

第二步: 设置 Express 应用:

创建一个名为 app.js 的新文件并设置一个基本的 Express 应用程序。引入 Express 模块并创建一个 Express 应用实例。

const express = require(‘express‘);
const app = express();
const PORT = 3000;

第三步: 配置 Express 使用 EJS:

配置 Express 使用 EJS 作为模板引擎。这包括将 INLINECODE78690ad3 设置为 INLINECODE24215558,并指定存放视图(EJS 模板)的目录。

app.set(‘view engine‘, ‘ejs‘);
app.set(‘views‘, __dirname + ‘/views‘);

第四步: 创建一个简单的 EJS 模板:

在项目根目录下创建一个名为 INLINECODE203b6910 的目录。在 INLINECODEea844539 目录内,创建一个名为 index.ejs 的新文件并编写一个简单的 EJS 模板。

第五步: 设置路由以渲染 EJS 模板:

在 Express 中定义一个路由来渲染我们刚才创建的 EJS 模板。该路由将响应根 URL(INLINECODE6bf02278)的 HTTP GET 请求,并渲染 INLINECODEf629afc3 模板。

app.get(‘/‘, (req, res) => {
    res.render(‘index‘);
});

第六步: 启动 Express 服务器:

最后,启动 Express 服务器并监听您选择的端口(例如端口 3000)。

app.listen(PORT, () => {
    console.log(`Server is running on http://localhost:${PORT}`);
});

示例: 下面是关于模板引擎的代码示例:

HTML


CODEBLOCK_9df5581d

JavaScript


CODEBLOCK_fadfa225

第七步: 运行您的 Express 应用程序

node app.js

在 Web 浏览器中访问 http://localhost:3000,您应该会看到“Welcome to Express with EJS”的消息以及由 EJS 模板渲染的今天的日期。

输出:

!Untitled-design-(2).gif)在 Express 中使用模板引擎

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。如需转载,请注明文章出处豆丁博客和来源网址。https://shluqu.cn/39935.html
点赞
0.00 平均评分 (0% 分数) - 0