摘要：首先，它允許我們能夠編寫一個分離的文件作為模板，這樣子我們就能在編輯的時候看到正確的語法高亮，這也是很多開發者喜歡的原因注我覺得這是因為現在的人越來越懶，越來越依賴的原因。

這篇文章是翻譯的Vue.js的官方blog，最后加了些自己的理解。

原文地址：Why Vue.js doesn"t support templateURL

很多Vue的新手，特別是使用過Angular的都會問“我能不能用 templateURL”,由于回答了太多次了，所以作者決定記下來。

Angular的世界里，templateURL 或者 ng-include 允許使用者在運行時動態的加載遠程模板文件，這個看起來很方便，作為一個自帶功能，但是讓我們來重新審視下這個功能。

首先，它允許我們能夠編寫一個分離的html文件作為模板，這樣子我們就能在編輯的時候看到正確的語法高亮，這也是很多開發者喜歡的原因（注：我覺得這是因為現在的人越來越懶，越來越依賴IDE的原因）。但是分離你的js和html代碼真的是個好主意么？在Vue.js的組件中，js和html天然緊耦合，事實上，這些代碼在一個文件更簡單易懂。在2個文件中來回切換上下文邏輯實際上讓開發者更不爽。在vue的概念里，組件才是vue.js的基本構建單位，并不是模板文件。每一個vue.js的模板都伴隨著他的好基友js，分離他們太過于殘忍了。

其次，因為templateURL是在運行時通過ajax的方式加載模板，不需要構建步驟為了你分離的文件。開發的時候，這很爽，但是上線部署的時候，你就麻煩了。在HTTP2.0沒有大面積支持前，HTTP的請求數仍然是頁面加載的最關鍵因素。想象一下，在你的網站中，每個組件都是用templateURL，那么頁面出來前，你可能需要加載幾十個HTTP請求。可能你并不知道，大多數的瀏覽器是限制同一域名的并發請求數量的。當你超過這個限額的時候，你頁面的初始渲染時間就得等待每次請求的返回。當然，有工具可以幫助你提前注冊你所有的模板，但是這就多了一個構建步驟，事實上，這就是大型網站的必然趨勢。

那么，在沒有templateURL的情況下，我們怎么處理開發環境問題呢？
在js里面拼接字符串是很爛的做法，使用