Koa 应用中集成 ejs 模版引擎-JavaScript中文网-JavaScript教程资源分享门户

前言

Koa 是一个 Node.js 的 Web 框架，它的设计理念是中间件，通过多个中间件组合来完成请求的处理。而 ejs 则是一个常用的 Node.js 模版引擎，它可以将数据渲染到 HTML 页面中，从而实现动态页面的生成。在 Koa 应用中集成 ejs 模版引擎，可以让我们更加方便地进行页面的渲染和数据的展示。

安装

首先，我们需要安装 Koa 和 ejs。

npm install koa --save
npm install ejs --save

使用

初始化应用

在使用 Koa 和 ejs 之前，我们需要先初始化一个 Koa 应用。

const Koa = require('koa');
const app = new Koa();

配置 ejs

在应用中集成 ejs，需要引入 ejs 并进行配置。

const views = require('koa-views');
const path = require('path');

app.use(views(path.join(__dirname, './views'), {
  extension: 'ejs'
}));

上面的代码中，我们使用了 koa-views 模块来集成 ejs，path.join(__dirname, './views') 表示模版文件所在的目录，extension: 'ejs' 表示模版文件的后缀名是 ejs。

创建路由

接下来，我们需要创建一个路由来处理请求，并在路由中渲染模版。

const Router = require('koa-router');
const router = new Router();

router.get('/', async (ctx, next) => {
  await ctx.render('index', {
    title: 'Koa + ejs',
    content: '这是一个 Koa 应用中使用 ejs 模版引擎的示例'
  });
});

app.use(router.routes());

上面的代码中，我们创建了一个 GET 请求的路由，路由的路径是 /，渲染的模版是 index.ejs，同时向模版传递了 title 和 content 两个变量。

模版文件

最后，我们需要编写一个 ejs 模版文件，用来展示数据。

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
  </head>
  <body>
    <h1><%= title %></h1>
    <p><%= content %></p>
  </body>
</html>

上面的代码中，我们使用 <%= %> 来输出变量的值。

运行应用

现在，我们已经完成了 Koa 应用中集成 ejs 模版引擎的所有步骤。接下来，我们可以运行应用，访问 http://localhost:3000，就可以看到渲染出来的页面了。

app.listen(3000, () => {
  console.log('Koa app is listening on port 3000');
});

总结

本文介绍了如何在 Koa 应用中集成 ejs 模版引擎，包括安装、配置、路由和模版文件等方面的内容。通过本文的学习，读者可以更加方便地进行页面的渲染和数据的展示。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/658bfc4aeb4cecbf2d14e2fa