在 Express 中使用模板引擎

 更新时间:2015年12月10日 16:32:19   投稿:mrr  
这篇文章主要介绍了在 Express 中使用模板引擎的相关资料,需要的朋友可以参考下

需要在应用中进行如下设置才能让 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实现双向链表过程解析

    JavaScript实现双向链表过程解析

    这篇文章主要介绍了利用JavaScript实现双向链表以及它的封装和常用操作,文中的示例代码讲解详细,对日常的学习和工作都有一定的价值,快来和小编一起学习吧
    2021-12-12
  • js鼠标点击图片切换效果实现代码

    js鼠标点击图片切换效果实现代码

    这篇文章为大家分享了js鼠标点击图片切换效果实现代码,特别炫酷的效果,具有一定的参考价值,推荐给大家,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • javascript设计模式 – 享元模式原理与用法实例分析

    javascript设计模式 – 享元模式原理与用法实例分析

    这篇文章主要介绍了javascript设计模式 – 享元模式,结合实例形式分析了javascript享元模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下
    2020-04-04
  • JS使用ajax从xml文件动态获取数据显示的方法

    JS使用ajax从xml文件动态获取数据显示的方法

    这篇文章主要介绍了JS使用ajax从xml文件动态获取数据显示的方法,实例分析了javascript使用Ajax技术操作XML文件的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • JavaScript接口实现方法实例分析

    JavaScript接口实现方法实例分析

    这篇文章主要介绍了JavaScript接口实现方法,结合实例形式详细分析了JavaScript接口实现原理、操作步骤与相关注意事项,需要的朋友可以参考下
    2020-05-05
  • ES6中定义类和对象的方法示例

    ES6中定义类和对象的方法示例

    这篇文章主要介绍了ES6中定义类和对象的方法,结合实例形式分析了ES6中类的定义、继承、静态方法、静态属性等相关操作技巧,需要的朋友可以参考下
    2019-07-07
  • uni-app实现全局变量的方式小结

    uni-app实现全局变量的方式小结

    uni-app是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到 iOS、Android、Web(响应式)、以及各种 小程序,下面我们就来看看uni-app实现全局变量有哪些方法吧
    2024-12-12
  • js+html5实现侧滑页面效果

    js+html5实现侧滑页面效果

    这篇文章主要为大家详细介绍了js+html5实现侧滑页面效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 原生js实现简单轮播图

    原生js实现简单轮播图

    这篇文章主要为大家详细介绍了原生js实现简单轮播图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-10-10

最新评论