將JavaScript模板預編譯爲項目構建函數

更新我想避免編譯客戶端模板，並在我的本地ant構建過程中編譯它們。也許類似裝載jQuery和jQuery的模板到犀牛，經過$.template()功能各.jst文件的內容，反過來，建設「templates.js」它應該包含：將JavaScript模板預編譯爲項目構建函數

$.template['model-view'] = resultingFunction.toString(); 
// 1 for each .jst file

這樣一來，我可以保持每個模板放在一個單獨的文件中，並避免讓所有客戶端冗餘編譯相同的模板。

我使用jQuery的模板，並希望在項目建成，向他們送出分成編譯到函數自己的文件（例如，模型view.jst），並提供在jQuery的.tmpl（）作用域供以後使用。

例如，給定的文件模型view.jst

<li>${name}</li>

這個文件和所有其他.jst文件應在構建有所回升，編成以後可以在任何地方使用的功能節目像這樣：

$.tmpl('model-view', { 
    name: 'Matt' 
});

來源

2011-06-24 Matty F

我真的不知道你期望的答案是什麼 - 構建腳本？因爲你的構建步驟應該只是讀取* .jst文件並將它們轉換爲像'modelView =「

$ {name}

」'（不要忘記正確地轉義字符串內容）。調用'$ .tmpl（modelView，{...}）'然後就可以工作了。 –

我認爲你找到自己的解決方案 –

我有一個粗略的想法，需要做什麼，只是不完全如何。我認爲試圖將jQuery和jQuery模板導入到犀牛中的最大問題是它們需要犀牛不具備的DOM。我可能會看到如果我可以先導入一個「無頭」瀏覽器到犀牛，並從那裏... –

我使用Node.js和coffeescript通過將部分模板目錄設置爲執行來解決此問題能夠預編譯的功能。希望這可以幫助。

https://github.com/wookiehangover/jquery-tmpl-jst

來源

2011-07-10 18:21:33 wookiehangover

我讓你決定，如果你喜歡它，或者你不:)

常見的JS庫定義這個FUNC重刑：

function loadTemplate(templateName) { 
    $.ajax({ 
     url: templateName + '.jst', 
     success: function(data) { 
     $.template(templateName, data); 
     }}); 
}

然後在你掌握HML文件<head></head>部分，您可以添加：

<script type="text/javascript">loadTemplate('model-view');</script> 
<script type="text/javascript">loadTemplate('another-model-view');</script>

這樣你就可以在你的代碼的任何地方使用

$.tmpl('model-view', your-data) 
$.tmpl('another-model-view', your-data)

希望它可以幫助

來源

2011-06-24 08:08:36

發送一個AJAX請求爲每個模板不是一個好主意。 – ThiefMaster

是的，我知道，但我沒有看到任何其他的東西。 jQuery模板應該允許像這將會很棒 –

無論如何，這並不能回答這個問題，因爲Matty F不希望客戶端編譯 –

將JavaScript模板預編譯爲項目構建函數

回答

相關問題