一、使用vscode插件干什么？

vscode插件是為了更高效的代碼開發，為了美觀的代碼格式。

下面推薦一些好用的插件

1.簡體中文語言包

插件名稱：Chinese (Simplified) (簡體中文) Language Pack for Visual Studio Code
作用：將VSCode操作界面轉換為中文，安裝完成，重啟VScode即可

2.顯示文件圖標

插件名稱：vscode-icons
作用：vscode中的文件管理的樹目錄顯示圖標

3.Live Server 開啟本地服務器

插件名稱：Live Server
作用：開啟一個具有實時重新加載功能的小型開發服務器，可以一邊編寫代碼一邊保存，即實時刷新預覽

4.自動修改標簽對名稱

插件名稱：Auto Rename Tag
作用：修改標簽，自動幫你完成頭部和尾部閉合標簽的同步修改

5.將代碼生成一張圖片

插件名稱：carbon-now-sh
作用：在實際開發中遇到技術問題或者做部分代碼片段分享，可以使用該插件將代碼生成一張圖片
1.在VSCode中，先選中需要生成圖片的代碼
2.打開命令托盤：Windows：Ctrl + Shift + P，Mac：Cmd + Shift + P
輸入Carbon，回車
3.再打開的網頁中，復制粘貼即可

6.prettier 格式化代碼

插件名稱：prettier
作用：格式化美化代碼 ，按Ctrl + s 保存會自動格式化

7.自動補全標簽

插件名稱：Auto Close Tag
作用：自動補全結束標簽

8.Beautify 格式化

插件名稱：Beautify
作用： 可格式化css,js,less代碼

9.Code Spell Checker 拼寫檢測

插件名稱：Code Spell Checker
作用：幫助我們發現代碼中拼寫錯誤的單詞

10.HTML Snippets

插件名稱：HTML Snippets
作用：HTML代碼片段，該插件可為你提供html標簽的代碼提示，不用鍵入尖括號了

11.Path Intellisense 路徑提示

插件名稱：Path Intellisense
作用：自動提示文件路徑，支持各種快速引入文件

12.Image preview 圖片預覽

插件名稱：Image preview
作用：鼠標懸浮在鏈接上可及時預覽圖片

13.JavaScript (ES6) code snippets

插件名稱：JavaScript (ES6) code snippets
作用：ES6語法智能提示，以及快速輸入

14.TSLint

插件名稱：TSLint
作用：ts的書寫規范，這個插件是一個系列，同時還提供了TSLint (deprecated)，TSLint Vue，TSLint Vue-TSX

15.koroFileHeader

插件名稱：koroFileHeader
作用：用于生成文件頭部注釋和函數注釋的插件

16.GitLens

插件名稱：GitLens
作用：能顯示每一行代碼的作者以及提交時間。

17.GitHistory

插件名稱：GitHistory
作用：GitHistory可查看和搜索git日志以及圖形和詳細信息，同時還支持分支比較，分支管理等操作，非常方便

18.Partial Diff 文件比較

插件名稱：Partial Diff
作用：將文件進行對比

19.Polacode-2020(類似第五個插件)

插件名稱：Polacode-2020
作用：代碼轉化成圖片
1.在VSCode中，先選中需要生成圖片的代碼
2.打開命令托盤：Windows：Ctrl + Shift + P 輸入polacode

20.browser preview 內置瀏覽器

插件名稱：browser preview
作用：可以讓我們在vscode里面打開瀏覽器，一邊編碼一邊查看

21.Settings Sync

插件名稱：Settings Sync
作用：可以讓我們的vscode配置同步到云端，當我們跟換電腦或者再次安裝vscode的時候，只需要登錄賬號即可同步配置了

22.Vetur

插件名稱：Vetur
作用：Vetur是一款Vue代碼高亮顯示的一款插件

23.Vue 3 Snippets

插件名稱：Vue 3 Snippets
作用：這是一款在 Vue 2 或者 Vue 3 開發中提供代碼片段，語法高亮和格式化的 VS Code 插件，能極大提高你的開發效率。

24.Rainbow Brackets

插件名稱：Rainbow Brackets
作用：不同顏色的括號插件

25.HTML CSS Support

插件名稱：HTML CSS Support
作用：在編寫樣式表的時候，自動補全功能大大縮減了編寫時間

26.Highlight Matching Tag

插件名稱：Highlight Matching Tag
作用：html標簽對齊高亮

27.px to rem & rpx (cssrem)

插件名稱：px to rem & rpx (cssrem)
作用：px轉rem插件

總結

以上是生活随笔為你收集整理的Vscode——开发常用插件分享的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。