jade模板引擎的單獨使用方法

主要學習jade文件的單獨使用方法。

  1. 安裝jade模塊
  2. 創建jade文件
  3. jade中數據填充
  4. 編譯

例子:
創建一個jade-example.jade文件,內容如下:

.header
h1=title
p
.body
    p=body
.footer
    div=By
        a(herf="http://www.baidu.com")=author.name
    ul
        each tag, index in tags
            li=tag

在文件中,主要包含titile:string, body:string,author:string,tags:Array<string>四個數據需要填充。 常用的數據源獲取可以從DB,File,User Input等方式獲取。如下提供一個數據填充方法。

創建jade-example.js文件用于jade-example.jade文件的數據填充,如下:

var jade = require("jade");
var fs = require("fs");
var data= {
    title:"Test Jade Example",
    author:{
        name:"Rill",
        twitter:"@rill"
    },
    tags:[
        "express",
        "node",
        'javascript'
    ],
    body:process.argv[2]//通過用戶輸入獲取數據
}
//如下提供三種編譯方法
fs.readFile('jade-example.jade', 'utf-8', function(err, source){
    //方法1 通過jade。compile
    var tmp = jade.compile(source);
    var html=tmp(data);
    console.log(html);
    // //方法2 通過jade。compile
    // var html = jade.render(source,data);
    // console.log(html);
});

// //方法1 通過jade。compile
// jade.renderFile("jade-example.jade", data, function(err, html){
//     console.log(html);
// })

如上,提供了jade中的三種編譯方法,jade.compile(), jade.render(), jade.renderFile()

在命令行中執行node jade-example.js "Test", 查看運行的效果

Paste_Image.png
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,948評論 18 139
  • 1. Java基礎部分 基礎部分的順序:基本語法,類相關的語法,內部類的語法,繼承相關的語法,異常的語法,線程的語...
    子非魚_t_閱讀 31,766評論 18 399
  • Spring Boot 參考指南 介紹 轉載自:https://www.gitbook.com/book/qbgb...
    毛宇鵬閱讀 46,958評論 6 342
  • 22年12月更新:個人網站關停,如果仍舊對舊教程有興趣參考 Github 的markdown內容[https://...
    tangyefei閱讀 35,224評論 22 257
  • 別名:龍沙、狗骨、卑相、卑鹽 基源植物:麻黃科麻黃屬草本狀小灌木植物草麻黃、木賊麻黃或中麻黃的干燥草質莖。 拉丁學...
    本草園丁閱讀 2,591評論 0 2