[Sublime Text 3 Package] HTML-CSS-JS Prettify

Jul 3, 2015

1 min read

HTML-CSS-JS Prettify套件是用來格式化html文件的工具一樣按下Ctrl + Shift + P透過Pageage Control來安裝套件

[![](http://4.bp.blogspot.com/-T9xlzy_ldYM/VZZJjIIlW9I/AAAAAAAACXk/ekC6uQ_sMYI/s1600/01.install%2Bpackage.png)](http://4.bp.blogspot.com/-T9xlzy_ldYM/VZZJjIIlW9I/AAAAAAAACXk/ekC6uQ_sMYI/s1600/01.install%2Bpackage.png)

找到HTML-CSS-JS PRettify套件按下Enter即可

[![](http://1.bp.blogspot.com/-aaHozB7QiKg/VZZJjH-vu5I/AAAAAAAACXo/HfQqJtO2nO8/s1600/02.htmlcssjs%25E5%25A5%2597%25E4%25BB%25B6.png)](http://1.bp.blogspot.com/-aaHozB7QiKg/VZZJjH-vu5I/AAAAAAAACXo/HfQqJtO2nO8/s1600/02.htmlcssjs%25E5%25A5%2597%25E4%25BB%25B6.png)

套件需要透過Node來格式化文件，所以需要確定Node執行檔的路徑

[![](http://1.bp.blogspot.com/-ZIQo-oOuuDg/VZZJjJ2VcXI/AAAAAAAACXs/lm1kcnRjuFI/s1600/03.%25E8%25A8%25AD%25E5%25AE%259Anodejs%25E8%25B7%25AF%25E5%25BE%2591.png)](http://1.bp.blogspot.com/-ZIQo-oOuuDg/VZZJjJ2VcXI/AAAAAAAACXs/lm1kcnRjuFI/s1600/03.%25E8%25A8%25AD%25E5%25AE%259Anodejs%25E8%25B7%25AF%25E5%25BE%2591.png)

確定node.exe執行檔的路徑即可

[![](http://1.bp.blogspot.com/-LFnjhIHYh6I/VZZJjzkQH8I/AAAAAAAACXw/Z5U0KfZ5C3k/s1600/04.%25E8%25BC%25B8%25E5%2585%25A5NodJS%25E8%25B7%25AF%25E5%25BE%2591.png)](http://1.bp.blogspot.com/-LFnjhIHYh6I/VZZJjzkQH8I/AAAAAAAACXw/Z5U0KfZ5C3k/s1600/04.%25E8%25BC%25B8%25E5%2585%25A5NodJS%25E8%25B7%25AF%25E5%25BE%2591.png)

準備一份html文件，按下Ctrl + Shift + H快速鍵

[![](http://2.bp.blogspot.com/-dbffjR23Gzk/VZZJkFkfxaI/AAAAAAAACX0/SeWf0YZl564/s1600/05.html%25E6%2596%2587%25E4%25BB%25B6.png)](http://2.bp.blogspot.com/-dbffjR23Gzk/VZZJkFkfxaI/AAAAAAAACX0/SeWf0YZl564/s1600/05.html%25E6%2596%2587%25E4%25BB%25B6.png)

即可完成格式化

[![](http://4.bp.blogspot.com/-wfzQJ8kNlOI/VZZJkVkxzlI/AAAAAAAACX4/4phj-dXYKr0/s1600/06.%25E6%25A0%25BC%25E5%25BC%258F%25E5%258C%2596%25E5%25AE%258C%25E6%2588%2590.png)](http://4.bp.blogspot.com/-wfzQJ8kNlOI/VZZJkVkxzlI/AAAAAAAACX4/4phj-dXYKr0/s1600/06.%25E6%25A0%25BC%25E5%25BC%258F%25E5%258C%2596%25E5%25AE%258C%25E6%2588%2590.png)