[教學] Visual Studio Code 內建原始碼格式化功能，一鍵快速讓亂七八槽的HTML與JS碼，變得條理有致

　　由於現在網頁的複雜度愈來愈高，已無法再像以前，透過Adobe Dreamweaver即見即所得的方式，進行網頁的編輯，因此大部分的時候，都得用手KEY，才能讓網頁達到理想中的效果，雖然大家知道，在編輯原始碼，可透過Tab鍵，進整理原始碼，但不得不說的是，有時在趕件時，雖然原始碼有縮排，但卻會一下前一下後，看起來有點混亂，因此先前梅干曾分享過Sublime Text的HTML格式化外掛，讓雜亂的HTML的原始碼，也能快速變得整整齊齊的。

最近跳到微軟所推出的VS Code時，也已慢慢感受到VS Code強大的編輯功能，但遇到HTML碼雜亂，與壓縮過的HTML碼，那還真是跟天書一樣，而VS Code竟然有個超強大功能，那就是內建了原始碼格式化功能，除了可將雜亂或壓縮過的HTML還原外，就連Javascript也可以，因此想知道，如何使用VS Code來格式化原始碼的朋友，現在就一塊來看看吧！

---

Step1
無論是壓縮過還是亂七八糟的HTML原始碼，當透過VS Code開啟後，將所有的碼全選起來。

---

Step2
接著神奇的時刻要到了，再按下鍵盤的Alt+Shift+F鍵，立馬就可將HTML變成條理有致，同時原始碼也會排的漂漂亮亮的。

---

Step3
接下來Javascript也一樣，開啟後再全選。

---

Step4
一樣的再按下Alt+Shift+F鍵，立即就可將Javascript碼還原，是不是感到超好用的呀！且內建就有，完全不用再加裝任何的套件。