2015-10-19 33 views
1

tl; dr

有沒有像其他任何JavaScript模板引擎(例如Mustache,Handlebars或Nunjucks)一樣的將Jade完全用於客戶端的方法,以便通過ajax加載包括?無節點使用Jade模板的簡單方法?

更多信息:

我有沒有在節點上運行(不幸的是,由於各廠商不提供節點庫還),我真的開始喜歡的語法和玉的能力的Web應用程序。不幸的是,似乎Jade中的所有內容都需要某些節點,無論是在開發流程中還是在服務器端。我絕對不能在服務器端使用它,並且不希望將其引入到僅用於模板的開發週期中。

看起來好像所有這些都需要打包依賴關係(這可以通過browserify完成)並實現fs以使用ajax讀取文件。這是否已經有一些實現?

此外,每個文件,每個會話編譯一次所花費的時間對於此應用程序來說並不是真正的問題。

+0

還有其他的方法來編譯玉比節點。查看[Jade github頁面](https://github.com/jadejs/jade)的底部,查看其他語言的實現列表。其中一個應該適用於你的服務器。 – Nuclearman

回答

2

我居然找到了這樣做的方式,完全在客戶端:

  1. 使用browserify CDN獲取節點包客戶端捆綁。
  2. 的「FS」模塊中捆綁實行「readFileSync」功能使用同步的XmlHttpRequest並從服務器檢索文件(這是目前空的,所以沒有函數存在)

中提琴!

UPDATE:

這是我實現:

2:[function(require,module,exports){ 
module.exports = { 
cache: { }, 
readFileSync: function(path){ 
    return this.cache[path] || (this.cache[path] = (function(){ 
    var request = new XMLHttpRequest(); 
    request.open('GET', path + '?_=' + $.time(), false); 
    request.send(); 
    if (request.status === 200) { 
     return request.responseText; 
    } 
    else { 
     throw 'Unable to load template: ' + path; 
    } 
    }).call()); 
} 
}},{}] 
+0

你介意分享你的實施嗎? –

+1

我添加圍繞線423玉1.11.0源文件中的以下內容: '2:[功能(需要,模塊,出口){ \t module.exports = { 緩存:{}, \t \t readFileSync:函數(路徑){ return this.cache [path] || (this.cache [path] =(function(){var {request} = new XMLHttpRequest(); request.open('GET',path +'?_ ='+ $ .time(),false); request 。發送(); 如果(request.status === 200){ 回報request.responseText; } 其他{ 扔 '無法加載模板:' +路徑; }。 })()調用) ; \t \t} \t} },{}]' – jrb