nodejs模板引擎(一)

svygh1232024-07-13 20:05

在 Node.js 中使用模板引擎可以让您更轻松地生成动态 HTML 页面，通过将静态模板与动态数据结合，您可以创建可维护且易于扩展的 Web 应用程序。以下是一个使用 Express 框架和 EJS 模板引擎的基本示例：

安装必要的依赖 ：

首先，确保您已安装 Node.js 和 npm。然后，在您的项目目录中运行以下命令来安装 Express 和 EJS：
bash 复制代码
```
npm install express ejs
```

创建 Express 应用 ：

接下来，创建一个基本的 Express 应用，并设置 EJS 作为模板引擎：

javascript 复制代码

const express = require('express');
const app = express();
const path = require('path');

// 设置 EJS 引擎和视图路径
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));

// 设置静态资源目录
app.use(express.static(path.join(__dirname, 'public')));

// 路由
app.get('/', (req, res) => {
    const data = { title: 'My Title', message: 'Hello from EJS!' };
    res.render('index', data);
});

// 启动服务器
const port = process.env.PORT || 3000;
app.listen(port, () => {
    console.log(`Server running on port ${port}`);
});

创建模板文件 ：

在 views 文件夹中创建一个名为 index.ejs 的文件。EJS 使用 <% %> 作为脚本标签来嵌入 JavaScript 代码：

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><%= title %></title>
</head>
<body>
    <h1>Welcome to my site</h1>
    <p><%= message %></p>
</body>
</html>

运行应用 ：

运行您的应用，然后访问 http://localhost:3000/，您应该看到动态生成的页面。

这只是使用 EJS 的一个简单示例。不同的模板引擎可能有不同的语法和特性，但它们大多数都遵循类似的工作流程。您可以根据具体需求选择合适的模板引擎，如 Pug（旧称 Jade）、Handlebars、Mustache、Dust.js 等。

如果您需要更复杂的逻辑或者特定的功能，您应该查阅所选模板引擎的官方文档来了解如何使用它们的高级功能。