從這篇文章開始, 我們每篇開始前,先需要下載上次完成的版本。
開始前
如果沒有下載之前的代碼,可以使用 $npm install http-f2e-server@0.0.4
先安裝上一篇完成的版本。
服務(wù)端腳本嵌入
上篇完成了模板引用和包含功能,其中include在ASP,JSP,PHP這樣的腳本中都有類似功能, 事實上各種服務(wù)端腳本最基本的功能是一個嵌入式服務(wù)端代碼的模式, 例如php的 <?php?>
,以及ASP和JSP使用的 <% %>
。
underscore.js模板
- underscore http://underscorejs.org
- 因為 underscore.template 相對簡單純粹,我選用它作為f2e-server的默認模板引擎, 后面一些內(nèi)置頁面都將使用這個模板開發(fā), 如果感興趣您可以嘗試其他模板引擎如: jade
- API:
var compiled = _.template("hello: <%= name %>");
compiled({name: 'moe'});
=> "hello: moe"
安裝underscore
直接在根目錄使用 $npm install underscore
就能安裝underscore
植入功能
修改handle.js 模塊中的execute方法, 返回str前進行template包裝
var compiled = _.template(str);
return compiled({require: require});
- 測試源代碼
<ul id="each-list">
<%for(var i=0; i < 6; i++){
print( '<li>模板循環(huán)項'+(i+1)+'</li>\n' );
}%>
</ul>
- 輸出結(jié)果代碼
<ul id="each-list">
<li>模板循環(huán)項1</li>
<li>模板循環(huán)項2</li>
<li>模板循環(huán)項3</li>
<li>模板循環(huán)項4</li>
<li>模板循環(huán)項5</li>
<li>模板循環(huán)項6</li>
</ul>
PS:
本次開發(fā)代碼沒有發(fā)布倉庫版本,相關(guān)代碼跟隨下一篇共同發(fā)布到0.0.6版本。