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

一、主題及圖標
黑白兩款皮膚


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

扁平化的主題圖標庫


VSCode官方出品的圖標庫


二、功能強化
同步所有設置和插件

編程時間及行為跟蹤統計


代碼截圖

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

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



Git 圖形化顯示和操作


CodeStream: GitHub, GitLab, Bitbucket PRs and Code Review
團隊協作開發,評審,討論


四、數據庫
Oracle Developer Tools for VS Code
Oracle 數據庫支持

Microsoft SQL Server 數據庫支持

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

MongoDB 數據庫支持

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



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

在狀態欄中顯示標記的路徑

在 VSCode 里編寫 Markdown,支持預覽


預覽圖片


六、開發效率
代碼風格統一

更改命名風格


給變量起名的神器



自動格式化代碼

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


預覽正則表達式效果


七、前端開發
自動重命名 HTML或XML 標簽


自動添加 HTML/XML 關閉標簽


智能路徑提示





快速添加 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 定義


八、數據分析
對當前文本排序


預覽數據文件


九、修仙插件
刷題利器


網易云音樂(程序員版)


追番神器


站長資訊網