我最近一直在想如何使用模板系統的「相同」語法作爲客戶端模板的Twig，以及關於它與Twig的集成的可能性。發現Swig，這似乎是「Twig for javascript」。爲後端和前端模板使用相同的樹枝語法
使用相同的語法可以有以下幾個好處：
然而，一些挑戰會出現：
{% raw %}標籤可以完成這項工作，但是...<head>中收集我想要用於前端模板引擎的所有塊，每個塊都包含在<script>標記中。所以我需要「原始包含」這些塊。是否有人使用Twig與Swig或任何其他JavaScript模板系統的語法有點碰撞Twig的語法？ 您將如何管理/組織您的模板，以便您可以輕鬆地在前端使用模板？
免責聲明：這是對未決問題的公開答覆，請記住 。我分享我的經驗，因爲沒有簡單的方法來回答這個問題。
我是一個與symfony傢伙緊密合作的前端web開發人員。回到過去，我們一起使用樹枝和小鬍子模板。無論何處需要ajax調用，小鬍子模板都會被複制。很明顯，這是一個巨大的維護開銷。
我將答案分爲兩部分，分別討論兩個不同的問題;構建模板以使其易於前端使用，並添加了枝條的JavaScript實現。
模板結構
的第一步，我們邁出邏輯組織的模板，是將它們分爲頁面級，功能和表象模板。
頁面級別模板定義應用程序內容一般容器模板。 思考的：
功能模板只是一個更深一步。它們是用於構建整個頁面的預製件。通常它們是來自後端數據的地方。例如，考慮一個容器中的用戶列表。功能模板是容器，其中包括表示模板，將數據傳遞給它。
Presentational模板只是沒有邏輯（沒有數據轉換）的組件，用於輸入數據。這些組件可以嵌套。 （F.e. 按鈕和標題都包括在CTA組件中）。演示組件是我們構建模塊中最好的顆粒。
以這種方式組織代碼花費了很多時間，但是允許我們明確區分必須能夠前端渲染和可以邏輯渲染的組件。
Twig.js
下一步是積分twig.js（如在評論中的一個建議的）。
我想在我的主HTML文件中收集我想要用於前端模板引擎的所有塊，每個塊都包含在標籤中。所以我需要「原始包含」這些塊。
使用twig.js，您無需擔心爲前端製作模板。您可以提供url，如果模板擴展或包含一些其他模板，則會異步加載。因此，使用json數據提供的樹枝模板通過javascript呈現，並且不需要額外的模板引擎。
我從來沒有運行任何性能測試。雖然我可以想象twig.js比mustache慢很多，但在twig.js中只渲染無邏輯的組件可以提高性能。
如果我沒有解決任何問題，請讓我知道。我渴望進一步討論這個問題。
我認爲你引用的swig與其他大多數標籤爲swig的問題不一樣，或者它的標記wiki描述的是什麼。 – Flexo 2012-04-20 13:48:49
儘管不是您想要的確切目的，請查看[twig.js]（https://github.com/schmittjoh/twig.js）。 – Maerlyn 2012-04-20 15:18:02
@Maerlyn謝謝，我會的。 – 2012-04-20 15:53:58