一個項目中，可能存在若干重復的 html components，為了統一修改，我可能需要把它們提取出來，如<!-- _header.html --><header>
<h1>logo</h1>
<div class="search">
<input type="text">
<button type="submit">search</button>
</div></header><!-- _footer.html --><footer>
<p>copyright 2012-2014</p></footer>如果有服務器環境，如nginx，可以通過配置SSI來解析；或者通過php等動態服務器端語言進行解析。那么問題來了，如果我僅僅是想要把這個項目（靜態）構建入前端demo庫里，我如何把這些html components合并到引用它的各個頁面里呢？grunt是否有相應的插件？謝謝！
2 回答
臨摹微笑
TA貢獻1982條經驗 獲得超2個贊
你可以使用一種模板語言，比如 handlebars，然后使用某個能夠靜態的在 grunt 任務里直接把模板編譯成 html 的插件，比如grunt-static-handlebars。
如果想讓前端可以動態的載入模板，也推薦使用 handlebars，然后使用 grunt-browserify 和 hbsfy 這兩個插件結合一段極度簡單的客戶端的 js 代碼就能很優雅的解決這個問題。
客戶端代碼：
var template = require('./path/to/template.hbs');
document.getElementById('target-node').innerHTML = template({/* context */});- 2 回答
- 0 關注
- 761 瀏覽
添加回答
舉報
0/150
提交
取消