2015-02-06 82 views
10

我和我的團隊目前正在將一個相當大的項目從AMD + RequireJS移植到CommonJS + Webpack。我們喜歡Webpack提供的工具,並且認爲CommonJS是社區走向的方向:跳上你可以說的潮流。使用Webpack加載小鬍子模板

什麼是利用webpack自動加載和捆綁我們的.mustache模板文件的有效方法?目前,我們有一個使用xport在我們的項目文件夾中的所有文件.mustache捆綁成格式單一的js文件的手錶腳本:

var files = {}; 
files['path/to/file'] = '<div>{{content}}</div>'; 
files['path/to/other/file'] = '<span>{{stuff}}</span>'; 
... 

我們可以使用這個完全保持... 什麼是特別方便約我們目前的解決方案是,當我們製作一個新模板時,我們不必在項目中專門引用我們的模板。因爲腳本只是看着文件夾,所以字典得到更新,我們可以使用另一個庫來獲取字符串,並將其變爲可用的模板函數。

那麼目標是什麼? 我很好奇,如果有一種方法可以從我們的文件夾中的模板 - >我們可以在代碼中使用的功能,而無需特別要求文件到項目中。我們目前的解決方案不在webpack之內(除非當然有辦法掛鉤),這很煩人,因爲我們不需要2個監視腳本。我已經看過loaders,但這些似乎是1對1的源文件 - >輸出文件與多對1,這是我們目前的解決方案的偉大之處。

謝謝!

回答

0

我認爲你可以在require.context之上建立適合你需求的東西。指向你的模板目錄,它會提供一個API來訪問其中的模板。您可以將此方法與mustache-loader結合使用。