Node.js 有关模版引擎ejs和jade的结合(非express)

//以下为Ubuntu下的命令,创建文件夹,安装引擎等
 cd workspace/node
 mkdir testEJS
 cd testEJS
 npm install ejs

等待安装完成后,在testEJS 文件夹下新建两个文件,如:

index.js
var ejs = require('ejs');
var http = require('http');
varfs = require('fs');

function onRequest(request,response){

    fs.readFile('test.ejs', 'utf8', function (err, data) {
        if (err) throw err;
        var ret = ejs.render(data,{user:{name:"hello World"}});
       
        response.writeHead(200, {"Content-Type": "text/html"});
	      response.write(ret);
        response.end();
    });
}
http.createServer(onRequest).listen(8888);


test.ejs

<!-- DOCTYPE html-->

<h1 align="center">
  <%= user.name%>
</h1>

</pre>
<br />



运行命令

 node index.js

然后在浏览器中输入localhost:8888即可看到效果

下面为jade的引用,和ejs差不多,几乎同样的使用方法

先安装

 cd workspace/node/
 mkdir testJade
 npm install jade

等待安装完成

在testJade中新建两个文件 如下:

index.js
 var jade = require('jade');

var http = require('http');
 fs = require('fs');

function onRequest(request,response){
    /*第一种,间接读写文件
    fs.readFile('test.jade', 'utf8', function (err, data) {
        if (err) throw err;
        console.log(data);
        var fn = jade.compile(data);
        var html = fn({username:"huyinghuan"});
        response.writeHead(200, {"Content-Type": "text/html"});
	      response.write(html);
        response.end();
    });
    */
  //第二种直接读写文件
  jade.renderFile('test.html.jade', {user:{username:"huyinghuan2"}}, function(err, html) {
        response.writeHead(200, {"Content-Type": "text/html"});
	      response.write(html);
        response.end();
  });
}


http.createServer(onRequest).listen(8888);
	

test.jade
!!! 5
tml(lang="en")
  head
    title= pageTitle
  body
    h1 Jade - node template engine
    #container.col
      if youAreUsingJade
        p You are amazing
      else
        p Get on it!
      p.
        Jade is a terse and simple
        templating language with a
        strong focus on performance
        and powerful features.
    p #{user.username}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值