通過該擴展可為文件列表選擇漂亮可愛的圖標。如果文件是JavaScript，那么在文件名旁邊的material樣式中會有一個JavaScript圖標。若是從事視覺開發(fā)，那么該擴展就再適合不過了。

12.Javascript (ES6) Code Snippets

若你是JavaScript開發(fā)人員，Javascript (ES6) Code Snippets將是你最好的幫手。無論使用什么JavaScript框架，此擴展都將有所幫助。如果只是一遍又一遍地輸入相同的通用代碼，效果倒不是很明顯。

該代碼片段十分方便，是一個輕量級的庫擴展，它可以綁定任何標準的JavaScript調(diào)用，因此只需鍵入快捷代碼，即可看到整個通用代碼自動輸入到編輯器中。該擴展不僅支持Javascript ES6，還支持Typescript、Reactjs、Vue和HTML。

13.LiveServer

在使用Live Server時，該VSCode擴展將有助于打開當前項目的Live web服務(wù)器。一般這項工作用像Webpack這樣的構(gòu)建器完成即可，但是該擴展顯然更為有效。只需右擊并打開運行l(wèi)ive server，便會自動完成剩余的工作。

14.Github 擴展

若正在使用Github作為項目存儲庫，或者希望使用其他開發(fā)人員的源代碼存儲庫，那么這個擴展就是為您量身定做。

順便一提，Github現(xiàn)在由微軟所有和管理，所以Github和VSCode現(xiàn)在都是微軟產(chǎn)品之一。

使用Github擴展，可以輕松地連接其他開發(fā)人員的存儲庫、喜歡的開發(fā)人員的存儲庫，甚至自己的存儲庫。經(jīng)常使用Github的話，切換存儲庫將極為順手。

15.GitLens

Gitlens是另一個好用的擴展。它擴充了當前的VSCode Git功能，能夠從以前所作的提交和更改中同時執(zhí)行代碼比較，還擁有其他一些很厲害的特性。

16.NPM

所有現(xiàn)代開發(fā)人員都知道NPM是什么，以及它為什么這么重要。Node包管理器是一個可管理Package .json文件的擴展。如果需要的依賴項以及NPM包的版本控制尚未安裝，它會給出警告。

筆者所處理的大多數(shù)bug和錯誤都來自于使用的NPM包、函數(shù)和特性，因為它們與其他包不兼容，所以無法運行。如果沒有它所要求的依賴項沒有兼容的版本那可真是鴨梨山大！

17.Beautify

Beautify是另一用于代碼格式化的良好擴展，與前文提到的Prettier幾乎一樣，但是效果更漂亮。到目前為止，它已有將近1200萬的下載量了，還用筆者再多說什么嗎。它可以格式化用Javascript、JSON、Sass、CSS和HTML編寫的代碼。

18.Live Sass Compiler

如果您喜好Sass風(fēng)格，或者只是因為它是項目應(yīng)用程序需求的一部分而恰好正在使用Sass，那么這個VSCode擴展就是為您而生的!

它會實時將SASS/SCSS文件編譯成CSS文件，并自動提供應(yīng)用程序或瀏覽器中已編譯樣式的實時預(yù)覽。

19.Emmet

自筆者開始使用VSCode以來，就一直在使用Emmet。它可以幫助開發(fā)人員提高編寫代碼的速度。使用該擴展不久之后就再也離不開它了。

20.VSCode Icons

這是為前端開發(fā)人員打造的VSCode擴展。與前文提到的material圖標很相似，但是設(shè)計不同。前端開發(fā)人員通常都喜歡可視化，對吧。這個圖標有助于查看文件類型，不管它們是HTML,CSS, Javascript還是其他類型。

21.顏色選擇器

顏色選擇器擴展有助于輕松選擇CSS文件中的顏色。它將立即反映或應(yīng)用到當前正在處理的屬性。若喜歡使用RGBA顏色，也可以使用。

22.Quokka

Quokka被稱為JavaScript開發(fā)人員的現(xiàn)代便簽板。其構(gòu)建旨在幫助開發(fā)人員進行代碼檢查。這是一個完美的解決方案。

與其他VSCode擴展相比，它非常輕量級、高效且強大，有助于加快工作進程。同時，它又是實時的，可以給出即時反饋。

它可以為每個結(jié)果匹配一個固定的顏色類型，以便開發(fā)人員更容易理解代碼。

23.Live Share

Live Share是VSCode文本編輯器中最先進的特性之一。當與團隊成員一起工作時，它無可挑剔。LiveShare的功能之一是允許每個開發(fā)人員實時地與其他開發(fā)人員共享代碼片段。

這一點堪稱完美，且有助于實現(xiàn)更加高效和多產(chǎn)團隊協(xié)作。LiveShare允許即時共享當前的項目，即使在調(diào)試時也是如此。

協(xié)作者不需要安裝任何存儲庫、sdk或任何東西來連接其他開發(fā)人員的當前代碼。團隊中的每個人都可以通過協(xié)作來遠程探索和修復(fù)問題。

24.ES7, React, Redux & GraphQL Snippets

高級開發(fā)人員目前使用的多是JavaScript框架(如React)，以及其他與生產(chǎn)和復(fù)雜應(yīng)用程序兼容的技術(shù)，這項擴展是為他們量身定做的。

反復(fù)輸入標準代碼效率低下。在該代碼片段的幫助下，可以輕松創(chuàng)建基于類的組件、功能組件、輸入項、生命周期方法等，只需鍵入快捷代碼，這是筆者使用最多的擴展之一，因為筆者一直使用的是Reactjs和React Native。

25.REST 客戶端

另一個高級工具是Rest客戶端擴展，在使用其他第三方工具和APIs時，它將大有幫助。另外也有助于輕松發(fā)出HTTP請求。

通過此擴展可輕松地在代碼編輯器中直接調(diào)用和結(jié)束，大大節(jié)省了時間——你可以使用這個方法，而不是只為實現(xiàn)一個請求而來回切換瀏覽器或郵箱。

以上就是25個提升開發(fā)幸福感的VSCode擴展分享，希望大家喜歡，請繼續(xù)關(guān)注腳本之家。

相關(guān)推薦：

vscode怎么設(shè)置鍵映射擴展? vscode鍵映射的教程

vscode怎么新建一個窗口? vscode打開新窗口的技巧

VSCode怎么添加IntelliJ IDEA的快捷鍵? VSCode新增快捷鍵擴展的技巧

最新評論