前言
使用ejs中间件，还需要安装插件koa-views
安装依赖
npm install koa-views --save
npm install ejs --save
app.js
const Koa = require('koa');
const views = require("koa-views");
const router = require("koa-router")(); // 引入和实例化路由 推荐
const app = new Koa();
// 配置第三方中间件
// app.use(views("views", {map: {html: 'ejs'}})); // views 第一个参数：静态页面的路径 第二个参数配置对象 这样配置 模板文件必须要.html结尾
app.use(views("views", {extension: 'ejs'})) // 两种配置方法一样 模板文件的后缀名：.ejs
// 中间件配置公共的数据 // 所有的模板文件都能拿到这些数据
app.use(async (ctx, next)=>{
ctx.state = {
cUserName: '张三'
}
await next(); // 继续向下匹配路由
})
// 配置路由
router.get('/', async(ctx)=>{
const pageData = {
title: '标题',
list: [1,2,3,4]
}
await ctx.render("index", pageData)// 此处要添加await 因为render 是异步
});
router.get('/details', async(ctx)=>{
ctx.body = '详情';
});
// 启动路由
app.use(router.routes()); // 启动路由 可以链式调用
app.use(router.allowedMethods()); // 可配磕不配
app.listen(8081);
views/index.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%=title%></title>
</head>
<body>
<%- include("./public_header.ejs")%>
<h1>首页 这是一个ejs 的模板引擎--<%=cUserName%></h1>
<div><%=list%></div>
</body>
</html>
views/public_header.ejs
<h3>这是公共头部模块--<%=cUserName%></h3>
