在 Express 中使用模板引擎


Posted in Javascript onDecember 10, 2015

需要在应用中进行如下设置才能让 Express 渲染模板文件:

views, 放模板文件的目录,比如: app.set('views', './views')
view engine, 模板引擎,比如: app.set('view engine', 'jade')

然后安装相应的模板引擎 npm 软件包。

$ npm install jade --save

和 Express 兼容的模板引擎,比如 Jade,通过 res.render() 调用其导出方法 __express(filePath, options, callback) 渲染模板。

有一些模板引擎不遵循这种约定,Consolidate.js 能将 Node 中所有流行的模板引擎映射为这种约定,这样就可以和 Express 无缝衔接。

一旦 view engine 设置成功,就不需要显式指定引擎,或者在应用中加载模板引擎模块,Express 已经在内部加载,如下所示。

app.set('view engine', 'jade');

在 views 目录下生成名为 index.jade 的 Jade 模板文件,内容如下:

html
 head
  title!= title
 body
  h1!= message

然后创建一个路由渲染 index.jade 文件。如果没有设置 view engine,您需要指明视图文件的后缀,否则就会遗漏它。

app.get('/', function (req, res) {
 res.render('index', { title: 'Hey', message: 'Hello there!'});
});

此时向主页发送请求,“index.jade” 会被渲染为 HTML。

Javascript 相关文章推荐
将jQuery应用于login页面的问题及解决
Oct 17 Javascript
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
Jan 08 Javascript
jquery中选择块并改变属性值的方法
Jul 31 Javascript
js监控IE火狐浏览器关闭、刷新、回退、前进事件
Jul 23 Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
Jul 08 Javascript
移动端翻页插件dropload.js(支持Zepto和jQuery)
Jul 27 Javascript
分享JavaScript监听全部Ajax请求事件的方法
Aug 28 Javascript
基于Angularjs-router动态改变Title值的问题
Aug 30 Javascript
微信小程序获取用户信息的两种方法wx.getUserInfo与open-data实例分析
May 03 Javascript
layui下拉列表select实现可输入查找的方法
Sep 28 Javascript
js实现无缝轮播图
Mar 09 Javascript
vue3中provide && inject的使用
Jul 01 Vue.js
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
Dec 10 #Javascript
基于jQuery实现复选框是否选中进行答题提示
Dec 10 #Javascript
日常收集整理的JavaScript常用函数方法
Dec 10 #Javascript
详解AngularJS中module模块的导入导出
Dec 10 #Javascript
SpringMVC restful 注解之@RequestBody进行json与object转换
Dec 10 #Javascript
Spring mvc 接收json对象
Dec 10 #Javascript
SpringMVC返回json数据的三种方式
Dec 10 #Javascript
You might like
我的论坛源代码(八)
2006/10/09 PHP
随时给自己贴的图片加文字的php代码
2007/03/08 PHP
PHP用身份证号获取星座和生肖的方法
2013/11/07 PHP
ThinkPHP 3.2.3实现加减乘除图片验证码
2018/12/05 PHP
ajaxFileUpload.js插件支持多文件上传的方法
2014/09/02 Javascript
Node.js开源应用框架HapiJS介绍
2015/01/14 Javascript
JavaScript省市区三级联动菜单效果
2016/09/21 Javascript
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
原生js中ajax访问的实例详解
2017/09/19 Javascript
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
JS实现快递单打印功能【推荐】
2018/06/21 Javascript
Vue实现购物车的全选、单选、显示商品价格代码实例
2019/05/06 Javascript
微信打开网址添加在浏览器中打开提示的办法
2019/05/20 Javascript
微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容)
2019/11/01 Javascript
JavaScript 空间坐标的使用
2020/08/19 Javascript
JavaScript缓动动画函数的封装方法
2020/11/25 Javascript
python中的reduce内建函数使用方法指南
2014/08/31 Python
python中元类用法实例
2014/10/10 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
Python做图像处理及视频音频文件分离和合成功能
2020/11/24 Python
细说NumPy数组的四种乘法的使用
2020/12/18 Python
利用CSS3动画实现圆圈由小变大向外扩散的效果实例
2018/09/10 HTML / CSS
NFL Game Pass欧洲:在线观看NFL比赛直播和点播,以高清质量播放
2018/08/30 全球购物
最新的小工具和卓越的产品设计:Oh That Tech!
2019/08/07 全球购物
董事长秘书职责
2014/01/31 职场文书
生产部厂长职位说明书
2014/03/03 职场文书
农林环境专业求职信
2014/03/13 职场文书
应届硕士毕业生自荐信
2014/05/26 职场文书
党员民主评议个人总结
2014/10/20 职场文书
2014年党的群众路线活动个人整改措施
2014/10/28 职场文书
2014年统战工作总结
2014/12/09 职场文书
先进事迹材料怎么写
2014/12/30 职场文书
工作保证书怎么写
2015/02/28 职场文书
休假证明书
2015/06/24 职场文书
2016年中学法制宣传日活动总结
2016/04/01 职场文书
JavaScript原始值与包装对象的详细介绍
2021/05/11 Javascript