OnceIO(Node.JS)中安装、使用和更换doT、EJS、pug等模板引擎


发布者 ourjs  发布时间 1477634219696
关键字 JS学习  JavaScript 

OnceIOOnceDoc企业私有内容(文档)管理系统的底层Web框架,它可以实现模板文件、静态文件的全缓存,运行起来完全不需要I/O操作,并且支持客户端缓存优化,GZIP压缩等(只压缩一次),拥有非常好的性能,为您节约服务器成本。它的模块化功能,可以让你的Web进行分布式存储,在一个扩展包里即可包含前端、后端和数据库定义,只需通过添加/删除目录的方式就可实现功能删减,实现真正的模块化扩展。目前OnceIO已经开源,这里是介绍如何使用的一系列文章。

 

安装模板引擎

由于 doT.js 模板引擎的整体性能较优,OnceIO 采用 doT.js 作为默认模板引擎。在使用任何一种除了 doT.js 之外的模板引擎之前都需要先用 cmd 在项目文件夹安装这种模板引擎。以使用 Git Bash 安装 EJS 为例,使用的命令是:

$ npm install ejs  

Git Bash 界面如下:

Git Bash

 

使用模板引擎

在项目文件夹中创建 websvr.js 文件,以使用 doT.js 模板引擎为例,websvr.js 的代码如下:

var onceio = require('../onceio/onceio')

var app = onceio({
    home   :  "./"
  , port   :  8054
  , listDir:  true
  , debug  :  false
})

app.get('/dot', function(req, res) {
  res.render('dot.tmpl', {
    username: 'Kris'
  })
})  

创建好服务器文件后,再在项目文件夹中创建一个模板文件 dot.tmpl,代码如下:

<!DOCTYPE html>
<body>
  <h1> Hello, {{=it.username}} </h1>
</body>
</html>  

运行服务器,在浏览器中打开 localhost:8054/dot,得到以下结果:

可以注意到,这个网页和的内容是由前端文件和后端文件共同决定的,这就是使用了模板引擎的结果。

 

更换模板引擎

OnceIO 支持所有 Node.js 模板引擎,您可以根据自己的需要或喜好更换模板引擎。

例如,当您想使用 EJS 模板引擎时,可在项目文件夹中安装 EJS 后将 websvr.js 中的 app.get 函数替换成:

app.engine('ejs', require('ejs').render)

app.get('example_ejs', function(req, res) {
  res.render('example_ejs.ejs', {
      username: 'Kris'
  })
})

OnceIO 的模板引擎接口与 Express 有一些不同:在使用 EJS 或 pug 时,Express 中 require 函数的第一个参数为模板文件路径,而 OnceIO 中则为模析文件内容,几乎所有的模板引擎文件都提供直接渲染内容的接口,比如: require('pug').render  或  require('ejs').render

// Comparison between Express and OnceIO when using EJS
require('ejs').__express(path, option)
require('ejs').render(content, option)

//Comparison between Express and OnceIO when using pug
require('pug').__express(path, option)
require('pug').render(content, option)

模板文件 example_ejs.ejs 的代码为:

<!DOCTYPE html>
<body>
  <h1> Hello, <%= username %> </h1>
</body>
</html>

当您想使用 pug 模板引擎时,可在项目文件夹中安装 pug 后将 websvr.js 中的 app.get() 部分替换成:

app.engine('pug', require('pug').render);

app.get('/example_pug', function(req, res) {
  res.render('example_pug.pug', {
      username: 'Kris'
    , youAreUsingPug: true
  })
})

模板文件 example_pug.pug 的代码为:

doctype html
html
  body
    h1 Hello, #{username}

 

OnceIO地址:  https://github.com/OnceDoc/onceio

上一篇: OnceIO(Node.JS)中的模板引擎是什么及MVC设计模式的使用与实现