版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/bocongbo/article/details/83088147
后台服务的模板引擎有很多,但我还是喜欢用.html格式的模板
1、安装模板插件egg-view-ejs,虽然是ejs模板插件,但是后面会设置成html模板
npm i egg-view-ejs -S
2、在config/plugin.js里声明该插件
exports.ejs = {
enable: true,
package: 'egg-view-ejs',
};
3、在config/config.default.js里面配置(重点)
config.view = {
mapping: {'.html': 'ejs'} //左边写成.html后缀,会自动渲染.html文件
};
4、在路由配置中router.js,配置前端页面
router.get('/', controller.home.index);
5、在controller控制器配置
'use strict';
const Controller = require('egg').Controller;
class HomeController extends Controller {
async index() {
let title = "我是首页"; //向模板传入数据
await this.ctx.render('index',{
title: title
});
}
}
module.exports = HomeController;
6、在view视图层文件夹里面添加index.html
<!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><%-title%></title>
<link rel="stylesheet" href="/public/css/style.css">
</head>
<body>
<!-- 使用模板数据 -->
<h1><%-title%></h1>
<!-- 使用模板数据 -->
<h2>欢迎来到egg</h2>
</body>
</html>