版权声明:本文为博主原创文章,喜欢的话,可以通知我后进行转载哦! https://blog.csdn.net/maidu_xbd/article/details/86743156
consolidate是express中的一个模板引擎的结合体。包括了常用的jade和ejs。
配置模板引擎及使用方法如下:
1.模板引入----const consolidate = require('consolidate');
2.设置模板输出形式为:html页面---server.set('view engine', 'html');
3.设置模板文件位置----server.set('views', '模板文件目录');
4.选择ejs模板引擎----server.engine('html', consolidate.ejs);
5.渲染模板文件---
server.get('/', function (req, res){
res.render('模板文件', 数据);
});
route路由设置路径,把不同的路径(目录),对应到不同的模块。web服务器会根据用户输入的不同url,返回不同的页面。
路由使用方法如下:
1、模板引入----const expressRoute = require('express-route');
2、创建express的路由功能---var router = express.Router();
3、把roter添加到server,设置路由跳转的url----server.use('/page', router);
4、 route内部,根据不同的路由调用不同的路由函数, 返回不同的页面。----
router.get('/aaa', (req, res) => {
res.render('a.ejs', { name: 'xxxx' })
});
实例如下:
根目录下有test.js,template文件夹,template文件夹下有a.ejs和b.ejs
a.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>
<body>
我是页面a,我的名字叫
<%= name %>
</body>
</html>
b.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>
<body>
我是页面b,我的名字叫
<%= name %>
</body>
</html>
test.js如下:
const express = require('express');
const consolidate = require('consolidate');
const expressRoute = require('express-route');
var server = express();
server.listen(8080);
//配置模板引擎
//设置模板文件位置:放在当前根目录下
server.set('views', 'template');
//设置模板输出形式为:html页面
server.set('view engine', 'html');
//选择ejs模板引擎
server.engine('html', consolidate.ejs);
//route--web服务器会根据用户输入的不同url,返回不同的页面
var router = express.Router();//创建express的路由功能
server.use('/page', router);
router.get('/a', (req, res) => {
res.render('a.ejs', { name: '小布丁' });
});
router.get('/b', (req, res) => {
res.render('b.ejs', { name: '小不点' });
});
结果展示如下: