VS Code是這兩年非常熱門的一款I(lǐng)DE，它不僅有提升開發(fā)體驗(yàn)的界面、輕量化的編輯器，還有豐富而強(qiáng)大的插件，這些優(yōu)秀的插件使得VS Code生態(tài)體系更加吸引人，讓開發(fā)效率大大提升。本文來介紹10款高效的VS Code插件，總有一款能夠驚艷到你。

前言

我此前寫過一篇有關(guān)VS Code的文章：我最終還是選擇了VS code！，沒想到在公眾號(hào)和知乎受到很多同學(xué)的喜歡，也被多個(gè)公眾號(hào)先后轉(zhuǎn)載。

看來，現(xiàn)在VS Code的確是一款非常熱門、有強(qiáng)大用戶基礎(chǔ)的一款開發(fā)工具，因此，本文就來介紹10款高效、好用的插件，能夠讓原本單薄的VS Code如虎添翼，開發(fā)效率頓時(shí)提升到一個(gè)新的級(jí)別。

1. CodeIf安裝次數(shù)：2萬+"在計(jì)算機(jī)科學(xué)中只有兩件難事:緩存失效和命名。"

我對(duì)這句話深有同感，當(dāng)開發(fā)項(xiàng)目時(shí)，命名一直都是一種讓我痛苦的事情。我想，應(yīng)該不止我一個(gè)人有這樣的感覺。

可是，命名又是開發(fā)過程中一項(xiàng)非常重要的事情，例如，一個(gè)好的函數(shù)命名，能夠讓你瞬間明白它實(shí)現(xiàn)的功能，這樣就節(jié)省了很大一部分時(shí)間琢磨一段代碼到底是什么含義。

所以，每當(dāng)開發(fā)過程中遇到要命名的變量、函數(shù)、類時(shí)我就不得不停下開發(fā)，苦思冥想半天。

但是，CodeIf的出現(xiàn)讓這個(gè)問題迎刃而解，它通過搜索GitHub, Bitbucket, GitLab來找到真實(shí)的使用變量名，為你提供一些高頻使用的詞匯，同時(shí)為你標(biāo)明使用的語言、代碼鏈接。

可以直接在網(wǎng)頁上搜索要命令的詞匯，當(dāng)然，它不僅有網(wǎng)頁版，也支持VS Code, Atom, Sublime, WebStorm等開發(fā)工具。

在VS Code中，Extensions->搜索“CodeIf”即可完成安裝。

使用時(shí)只需要選中變量名，然后右鍵選擇CodeIf就可以跳轉(zhuǎn)到網(wǎng)頁，顯示候選命名。

2. local history安裝次數(shù)：14萬+

修改代碼之后想找回歷史代碼怎么辦？

在使用Pycharm、IDEA時(shí)可以直接查看本地歷史代碼，然后輕松恢復(fù)之前某個(gè)版本。但是，VS Code默認(rèn)是不支持local history的，所以，僅憑Ctrl+z撤銷操作是不行的。何況，撤銷操作是把前面步驟所有的操作都撤銷了，其中有很多是我們不需要的。

但是，為VS Code配合上local history，所有問問題就迎刃而解了。

安裝這款插件之后在側(cè)邊欄會(huì)出現(xiàn)LOCAL HISTORY的字樣，每當(dāng)我們保存更改時(shí)，它都會(huì)備份一份歷史文件，當(dāng)我們需要恢復(fù)之前版本時(shí)，只需要點(diǎn)擊一下對(duì)應(yīng)的文件即可。此外，它還會(huì)在編輯框顯示對(duì)比詳情，能夠讓你對(duì)修改位置一目了然。

3. Partial Diff安裝次數(shù)：19萬+

文件比較是一種即常用且實(shí)用的一項(xiàng)功能，例如，我們想查看哪里修改了代碼、查看輸出的日志信息有什么區(qū)別等等，如果用肉眼逐個(gè)詞的去分辨，顯然是無法承受的。

提起文件比較，我首先想到的就是Beyond Compare，這是一款好用的工具，但是，僅憑收費(fèi)這一點(diǎn)就把很多人拒之門外了。

還好，VS Code插件庫里有Partial Diff這款神奇的插件，選中一代碼，右鍵Select Text for Compare，選中另外一部分代碼，右鍵Compare Text with Previous Selection即可。

4. TODO Tree安裝次數(shù)：40萬+

我在此前多篇文章中提到過，習(xí)慣使用TODO、FIXME標(biāo)簽是一個(gè)非常好的習(xí)慣。

當(dāng)我們發(fā)現(xiàn)某塊代碼需要修改，或者某塊代碼需要以后進(jìn)一步完善，如果能夠給它做一個(gè)標(biāo)記，那么后續(xù)定位到對(duì)應(yīng)位置是一件非常輕松高效的事情。

關(guān)于TODO標(biāo)簽，很多作者都推薦過TODO Highlight這款插件，但是，我更加推薦使用TODO Tree。

雖然很多標(biāo)簽工具能夠?qū)崿F(xiàn)TODO標(biāo)簽高亮，但問題是“我們?cè)趺纯焖俣ㄎ坏綄?duì)應(yīng)的標(biāo)簽？”逐個(gè)的打開文件去尋找顯然是很麻煩的，效率并沒有得到太大的提升。

TODO Tree則不同，它不僅可以實(shí)現(xiàn)標(biāo)簽高亮，還可以在活動(dòng)欄添加一個(gè)選項(xiàng)卡，它能夠以不同視圖展示我們標(biāo)記的位置，單擊對(duì)應(yīng)標(biāo)簽就能夠快速定位到指定位置。

5. vscode-icons安裝次數(shù)：466萬+

一個(gè)好的編輯界面能夠讓開發(fā)過程心情舒暢，甚至可以提升開發(fā)效率。

顯然，VS Code默認(rèn)的圖標(biāo)是達(dá)不到這種程度的。

但是，配合vscode-icons這款插件就不同了，它具有以下特性，

?自定義圖標(biāo)?自動(dòng)檢測項(xiàng)目?自定義配置

它不僅能夠給文件夾、文件添加上舒適的圖標(biāo)，而且可以自動(dòng)檢測項(xiàng)目，根據(jù)項(xiàng)目不同功能配上不同圖標(biāo)，例如，git、Markdown、配置項(xiàng)、工具類等等。

6. Better Comments安裝次數(shù)：66萬+

是不是覺得注釋信息千篇一律？

Better Comments這款插件可以讓VS Code注釋信息更加人性化。

它可以根據(jù)告警、查詢、TODO、高亮等標(biāo)記對(duì)注釋進(jìn)行不同的展示。此外，還可以對(duì)注釋掉的代碼進(jìn)行樣式設(shè)置。另外，你想要的任何其他注釋樣式都可以在設(shè)置中指定。

7. Bracket Pair Colorizer安裝次數(shù)：250萬+

當(dāng)你看到上述示例中這樣包含多層嵌套的括號(hào)時(shí)，是不是覺得很凌亂？

至少，我是這樣的。

每當(dāng)看到這樣復(fù)雜嵌套括號(hào)時(shí)，尤其代碼行數(shù)多起來以后，就很難確定哪些是處于同一層次的。不弄明白層次結(jié)構(gòu)，當(dāng)然閱讀代碼也會(huì)麻煩很多。

Bracket Pair Colorizer這款插件可以給、、{}這些常用括號(hào)顯示不同顏色，當(dāng)點(diǎn)擊對(duì)應(yīng)括號(hào)時(shí)能夠用線段直接鏈接到一起，讓層次結(jié)構(gòu)一目了然。除此之外，它還支持用戶自定義符號(hào)。

這款神器徹底解決了我我在開發(fā)中的痛點(diǎn)。

8. Better Align安裝次數(shù)：10萬+

整潔的代碼，是一個(gè)優(yōu)秀程序員必須要做到的。當(dāng)我們閱讀那些大型公司開源的代碼時(shí)，會(huì)發(fā)現(xiàn)，它的設(shè)計(jì)模式、它的編程規(guī)范都讓人贊嘆不已。

Better Align就是這樣一款能夠?qū)崿F(xiàn)代碼規(guī)范的工具，它主要用于代碼的上下對(duì)齊。

它能夠用冒號(hào)（：）、賦值（=，+=，-=，*=，/=）和箭頭（=>）對(duì)齊代碼。

使用方法：Ctrl+Shift+p輸入“Align”確認(rèn)即可。

9. change-case安裝次數(shù)：24萬+

標(biāo)識(shí)符和命名規(guī)則是學(xué)習(xí)一門語言最基本，也是必須要了解的一項(xiàng)。

不同語言對(duì)變量名、函數(shù)名、類名的命名要求不同，有的是駝峰、有的是下劃線...但是，不管是什么要求，都有一個(gè)共性--命名很重要。

有些編程語言甚至對(duì)命名嚴(yán)格到如果不按規(guī)范要求，執(zhí)行時(shí)會(huì)直接報(bào)錯(cuò)。

而change-case就是一款快速修改當(dāng)前選定內(nèi)容或當(dāng)前單詞的命名的插件。

使用方法：Ctrl+Shift+p輸入“change”然后選擇要修改的格式即可。

10. Markdown All in One安裝次數(shù)：119萬+

Markdown對(duì)于開發(fā)者而言，應(yīng)該是一種常用的文檔書寫方式，雖然我在獨(dú)立Markdown文檔書寫時(shí)習(xí)慣于使用Typora，但是對(duì)于開發(fā)過程中涉及到的API接口文檔、README，我還是習(xí)慣于使用VS Code。

Markdown All in One這款插件可以實(shí)現(xiàn)媲美Typora的Markdown編輯體驗(yàn)，它具備如下特性，

?豐富的快捷鍵?TOC標(biāo)簽?數(shù)學(xué)公式?自動(dòng)完成?列表編輯?輸出HTML同時(shí)轉(zhuǎn)PDF?Github風(fēng)格文檔?......

這款插件真正做到了All in One。

非常感謝您讀完創(chuàng)新互聯(lián)的這篇文章："vs網(wǎng)站開發(fā)(電商網(wǎng)站開發(fā))"，僅為提供更多信息供用戶參考使用或?yàn)閷W(xué)習(xí)交流的方便。我們公司提供：網(wǎng)站建設(shè)、網(wǎng)站制作、官網(wǎng)建設(shè)、SEO優(yōu)化、小程序制作等服務(wù)，歡迎聯(lián)系我們提供您的需求。

新聞名稱：vs網(wǎng)站開發(fā)(電商網(wǎng)站開發(fā))
本文鏈接：http://www.rwnh.cn/news9/324659.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)建站、品牌網(wǎng)站建設(shè)、網(wǎng)站排名、定制開發(fā)、用戶體驗(yàn)、移動(dòng)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)