koa框架使用ejs模板引擎

最新推荐文章于 2025-06-15 14:25:14 发布

ey..

最新推荐文章于 2025-06-15 14:25:14 发布

阅读量588

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_47863547/article/details/119742485

本文介绍了如何在Koa框架中集成并使用EJS模板引擎，包括安装koa、koa-views和ejs，配置中间件，以及设置app.js和index.ejs文件的基本步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

koa框架中使用ejs

1.安装koa和koa-views

  npm install --save-dev koa koa-views / cnpm install --save-dev koa koa-views

2.安装ejs

  npm install ejs --save  /  cnpm install ejs --save

3.引入koa-views配置中间件

const views = require('koa-views');
app.use(views('views', { map: {html: 'ejs' }}));  

// 配置模板引擎中间件 -- 第三方中间件
app.use(views('views', {
  extension: 'ejs' /*应用ejs模板引擎 模板的后缀名是 .ejs*/
}))
// 这样配置也可以 注意如果这样配置的话 模板的后缀名是 .html
// app.use(views('views', { map: { html: 'ejs' } }));

4.app.js文件

const koa=require("koa");
const app=new koa();
const views = require('koa-views');
//require("koa-router")  返回的是函数  执行之后返回对象
const router=require("koa-router")();

// 配置模板引擎中间件 -- 第三方中间件
app.use(views('views', {
  extension: 'ejs' /*应用ejs模板引擎 模板的后缀名是 .ejs*/
}))

// 这样配置也可以 注意如果这样配置的话 模板的后缀名是 .html
// app.use(views('views', { map: { html: 'ejs' } }));


router.get('/add', async (ctx) => {
    let arr=['1','2','3'];
    await ctx.render('index',{list:arr});
  })
//路由和koa框架关联
app.use(router.routes());

let port=8000;
let host='localhost'
//端口监听
app.listen(port,host,()=>{
    console.log(`http://${host}:${port}`);
});

5.index.ejs文件

<!DOCTYPE html>
<html lang="en">
 
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
 <style>
     li{
         list-style:none;
     }
 </style>
<body>
    <ul>
        <%for(var i=0;i<=list.length;i++){%>
            <li><%= list[i]%></li>
        <%}%>
    </ul>
   
</body>
 
</html>