Vue——模板和樣式

　　使用單文件組件的好處是可以提高響應速度，提升體驗效果。

　　（一）模板預編譯　　

• 當使用 DOM 內模板或 JavaScript 內的字符串模板時，模板會在運行時被編譯為渲染函數。通常情況下這個過程已經足夠快了，但對性能敏感的應用還是最好避免這種用法。
• 預編譯模板最簡單的方式就是使用單文件組件——相關的構建設置會自動把預編譯處理好，所以構建好的代碼已經包含了編譯出來的渲染函數而不是原始的模板字符串。

　　（二）提取組件的CSS

• 當使用單文件組件時，組件內的 CSS 會以 <style> 標簽的方式通過 JavaScript 動態注入。
• 如果使用服務端渲染，這會導致一段“無樣式內容閃爍 (fouc)”。
• 將所有組件的 CSS 提取到同一個文件可以避免上述問題，也會讓 CSS 更好地進行壓縮和緩存。

　　（三）覆蓋樣式

　　在Vue中，若對ElementUI或者Vant原有組件的樣式進行修改的話，需要在單文件組件中<style>節點進行處理，並且不能在該標簽中添加scoped屬性，通過給出的唯一類名和要有組件的類名組合來修改原有組件的樣式。