這篇文章主要介紹了這么多年來我在使用 VSCode 過程中用到的一些不錯的插件。這些VSCode插件,幫你打造地表最強(qiáng)IDE!

一、主題及圖標(biāo)
黑白兩款皮膚


集成了多種主題皮膚,搭配 Material Icon Theme 食用更佳。【推薦學(xué)習(xí):vscode教程、編程教學(xué)】

扁平化的主題圖標(biāo)庫


VSCode官方出品的圖標(biāo)庫


二、功能強(qiáng)化
同步所有設(shè)置和插件

編程時間及行為跟蹤統(tǒng)計(jì)


代碼截圖

Chinese (Simplified) Language Pack for Visual Studio Code
中文語言包

三、Git 集成插件
在Visual Studio Code中查看和管理GitHub拉取請求和問題



Git 圖形化顯示和操作


CodeStream: GitHub, GitLab, Bitbucket PRs and Code Review
團(tuán)隊(duì)協(xié)作開發(fā),評審,討論


四、數(shù)據(jù)庫
Oracle Developer Tools for VS Code
Oracle 數(shù)據(jù)庫支持

Microsoft SQL Server 數(shù)據(jù)庫支持

支持 MySQL/MariaDB, Microsoft SQL Server, PostgreSQL, Redis, and ElasticSearch

MongoDB 數(shù)據(jù)庫支持

五、編程美化
給匹配的括號上色,可以自定義配置
注意:該插件已經(jīng)內(nèi)置到 vscode,不用重復(fù)安裝,
設(shè)置方法:setting 里搜索 editor.bracketPairColorization.enabled,設(shè)置為 true 即可生效



突出顯示匹配的開始和/或結(jié)束標(biāo)簽
官方支持的標(biāo)記:HTML和JSX。其他樣式(XML,Vue,Angular,PHP)也可以使用,但不能保證正常使用。

在狀態(tài)欄中顯示標(biāo)記的路徑

在 VSCode 里編寫 Markdown,支持預(yù)覽


預(yù)覽圖片


六、開發(fā)效率
代碼風(fēng)格統(tǒng)一

更改命名風(fēng)格


給變量起名的神器



自動格式化代碼

操作美化 json
快捷鍵
cmd+alt+v,驗(yàn)證cmd+alt+b,格式化cmd+alt+u,壓縮cmd+alt+',加轉(zhuǎn)義字符-
cmd+alt+;,去轉(zhuǎn)義字符


預(yù)覽正則表達(dá)式效果


七、前端開發(fā)
自動重命名 HTML或XML 標(biāo)簽


自動添加 HTML/XML 關(guān)閉標(biāo)簽


智能路徑提示





快速添加 console.log 信息,js debug 必備
快捷鍵
ctrl + alt + l 選中變量之后,使用這個快捷鍵生成 console.log
alt + shift + c 注釋所有 console.log
alt + shift + u 啟用所有 console.log
alt + shift + d 刪除所有 console.log



如圖


查看 css 定義


八、數(shù)據(jù)分析
對當(dāng)前文本排序


預(yù)覽數(shù)據(jù)文件


九、修仙插件
刷題利器


網(wǎng)易云音樂(程序員版)


追番神器


站長資訊網(wǎng)