资讯专栏INFORMATION COLUMN

Express 文档(使用模板引擎)

gxyz / 1850人阅读

摘要:一些与一起使用的流行模板引擎是和,应用程序生成器使用作为其默认值,但它也支持其他几个。有关可与一起使用的模板引擎列表,请参阅模板引擎,另请参阅比较模板引擎等。,使用的模板引擎,例如,要使用模板引擎。

使用模板引擎

模板引擎使你可以在应用程序中使用静态模板文件,在运行时,模板引擎用实际值替换模板文件中的变量,并将模板转换为发送到客户端的HTML文件,这种方法可以更轻松地设计HTML页面。

一些与Express一起使用的流行模板引擎是Pug、Mustache和EJS,Express应用程序生成器使用Jade作为其默认值,但它也支持其他几个。

有关可与Express一起使用的模板引擎列表,请参阅模板引擎(Express wiki),另请参阅比较JavaScript模板引擎:Jade、Moustache、Dust等。

注意:Jade已更名为Pug,你可以继续在你的应用中使用Jade,它可以正常工作,但是,如果你想要模板引擎的最新更新,则必须在应用程序中将Jade替换为Pug。

要渲染模板文件,请设置以下应用程序设置属性,在由生成器创建的默认应用程序app.js中设置:

views,模板文件所在的目录,例如:app.set("views", "./views"),默认为应用程序根目录中的views目录。

view engine,使用的模板引擎,例如,要使用Pug模板引擎:app.set("view engine", "pug")

然后安装相应的模板引擎npm包,例如安装Pug:

$ npm install pug --save
兼容Express的模板引擎(如Jade和Pug)导出名为__express(filePath, options, callback)的函数,该函数由res.render()函数调用以渲染模板代码。

某些模板引擎不遵循此约定,Consolidate.js库遵循此约定,映射所有流行的Node.js模板引擎,因此可以在Express中无缝工作。

设置视图引擎后,你不必在应用程序中指定引擎或加载模板引擎模块,Express在内部加载模块,如下所示(对于上面的示例)。

app.set("view engine", "pug")

views目录中创建一个名为index.pug的Pug模板文件,其中包含以下内容:

html
  head
    title= title
  body
    h1= message

然后创建一个路由来渲染index.pug文件,如果未设置view engine属性,则必须指定视图文件的扩展名,否则,你可以省略它。

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

当你向主页发出请求时,index.pug文件将渲染为HTML。

注意:视图引擎缓存不会缓存模板输出的内容,只缓存底层模板本身,即使缓存已打开,仍会每个请求重新渲染视图。

要了解有关模板引擎如何在Express中工作的更多信息,请参阅:“为Express开发模板引擎”。

上一篇:使用中间件 下一篇:错误处理

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100473.html

相关文章

  • Express 文档(常见问题)

    摘要:常见问题我该如何构建我的应用程序这个问题没有明确的答案,答案取决于你的应用程序规模和所涉及的团队,为了尽可能灵活,在结构方面没有做出任何假设。请参阅,了解以模型为中心的基于的框架。 常见问题 我该如何构建我的应用程序? 这个问题没有明确的答案,答案取决于你的应用程序规模和所涉及的团队,为了尽可能灵活,Express在结构方面没有做出任何假设。 在你喜欢的任何目录结构中,路由和其他特定于...

    MyFaith 评论0 收藏0
  • Nodejs 手动搭建 Express 项目

    摘要:接下来在控制台跑起来看看浏览器访问成功输出到这里项目就已经初步搭建起来了。到这里整个项目已经搭建起来了,大功告成。引用模块引入路由模块设置视图文件目录设置模板引擎为设置模板引擎为配置静态资源目录第一次写文章,请多加指教。 俗话说好记性不如烂笔头,在看了两天文档后,在这里准备把自己学到的东西写成文章记录下来。 安装全局模块 npm install -g express express-g...

    Eric 评论0 收藏0
  • 【实战】用 express+MongoDB 搭建一个完整的前端项目

    摘要:前言要做一个全沾的工程师,对于后端和数据库来说,即使不认识也要见个面的。基本了解的概念就好,主要是安装上数据库,并进行简单的增删操作。 前言:要做一个全沾的工程师,对于后端和数据库来说,即使不认识也要见个面的。本文给的例子很简单,也贴出来源码,只要一步步下来,就可以跑起来啦~~~ 思考一个需求:做一个登录页面,自己搭建服务和数据库,将用户输入的登录信息保存到数据库如何完成呢:首先选择...

    Steve_Wang_ 评论0 收藏0
  • Express 实战(七):视图与模板:Pug 和 EJS

    摘要:而框架中最常用的两个视图引擎是和。实际上这些上下文对象就是会在视图中使用到的变量。其实视图缓存并不是缓存视图实际上它缓存的视图路径。根据默认视图引擎将缺少拓展名的视图文件补充完整。实际上存在由不同组织维护的两个不同版本的。 showImg(https://segmentfault.com/img/remote/1460000010821004);前面的内容大都是关于 Express 框...

    wmui 评论0 收藏0
  • Express 文档(目录)

    摘要:文档基于的快速开放极简主义的框架,是一个最小且灵活的应用程序框架,为和移动应用程序提供了一组强大的功能。借助无数的实用程序方法和中间件,你可以快速轻松地创建强大的。提供了一层轻薄的基本应用程序功能,而不会隐藏你熟悉和喜爱的功能。 Express 文档 基于Node.js的快速、开放、极简主义的Web框架,Express是一个最小且灵活的Node.js Web应用程序框架,为Web和移动...

    马忠志 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<