vscode需要安裝的插件有哪些

在開發過程中，編輯器的功能越強大，對於提升開發效率就越有幫助。Vscode便是一個插件豐富而又強大的編輯器，下面就從多個方面介紹一些在編寫不同語言時用到的插件。

一、Python插件

Python是目前非常流行的一門編程語言，在Vscode之中，Python相關插件也是非常豐富的。

1. Python：

{
   "extensions.ignoreRecommendations":true,
   "files.autoSave": "off",
   "terminal.integrated.shell.windows": "C:\\\\Program Files\\\\Git\\\\bin\\\\bash.exe",
   "python.pythonPath":"${workspaceRoot}/venv/Scripts/python.exe"
}

Python插件包含必要的 IntelliSense 功能，比如代碼部分輸入——自動補全，函數特定參數信息，以及跳轉定義時的用法文檔等等。此外，它還可以自動格式化代碼、檢查語法和錯誤以及調試 Python 代碼。

2. PyLint：

{
   "python.linting.pylintEnabled": true
}

PyLint 是一個代碼分析工具，它可以檢查 Python 代碼以及提供高級錯誤檢查、調試和優化。可以查找一些潛在的問題，如名稱錯誤之類的潛在語法問題，以及導入 checkers 和其他內部 checkers。

3. Python Test Explorer：

{
   "python.testing.pytestEnabled": true,
   "python.testing.cwd":"'"
}

Python Test Explorer 可以為 Python 代碼提供 UI，使您可以更輕鬆地運行測試和自動化測試。

二、JavaScript插件

雖然 Vscode 本身內置了對於 JavaScript 語言的支持。但是，為了使用更多的特性，我們必須安裝一些插件。

1. ESLint：

{
   "editor.codeActionsOnSaveDelay": 1000,
   "editor.formatOnSave": true,
   "eslint.autoFixOnSave": true,
   "eslint.alwaysShowStatus": true,
}

ESLint作為一款廣受歡迎的 JavaScript 靜態檢測工具，它可以在保持 JavaScript 代碼風格統一的同時，檢測一些常見的代碼錯誤。

2. Prettier：

{
   "editor.formatOnSave": true,
   "prettier.singleQuote": true,
   "prettier.trailingComma": "es5",
   "prettier.arrowParens": "always",
}

Prettier 作為一款代碼格式化工具，可以格式化我們的代碼，讓代碼更加美觀易讀。

3. npm：

{
   "npm.packageManager": "yarn",
   "npm.enableScriptExplorer": true,
   "npm.autoDetect": "off",
}

在 Vscode 中使用 npm 插件可以快速地構建、運行和測試 JavaScript 應用程序。

三、HTML/CSS插件

在前端開發中，HTML 和 CSS 是必不可少的語言。下面介紹一些在 Vscode 開發中有用的 HTML 和 CSS 插件。

1. Auto Rename Tag：

{
   "auto-rename-tag.activationOnLanguage": [
      "*"
   ],
}

Auto Rename Tag 可以讓你自動重命名與此標記對應的 HTML 或 XML 結束標記。

2. CSS Peek：

{
   "csspeek.searchIncludeGlobPattern": "**/*.{vue,htm,html,php,css,less,scss,sass}"
}

CSS Peek 可以讓你方便地查看 CSS 類或 ID 對應的聲明。

3. HTML CSS Support：

{
   "html-css-class-completion.enableEmmetSupport": true,
   "html-css-class-completion.enableIdCompletion": true,
   "html-css-class-completion.enableClassCompletion": true,
}

HTML CSS Support 提供了 HTML 標記或 CSS 類和 ID 的代碼片段，可以讓你更快速地編寫 HTML 和 CSS 代碼。

四、其他插件

下面列舉一些常用的插件，它們可能適用於多種編程語言。

1. GitLens：

{
   "gitlens.codeLens.recentChange.enabled": true,
   "gitlens.codeLens.authors.enabled": true,
   "gitlens.codeLens.enabled": true,
}

GitLens 插件可以讓你方便地查看你的 Git 倉庫，並在編輯器中顯示相關信息，如提交信息、分支信息等等。

2. Bracket Pair Colorizer：

{
   "bracket-pair-colorizer.showBracketsInGutter": true,
   "bracket-pair-colorizer.colorMode": "Consecutive",
   "bracket-pair-colorizer.highlightActiveScope": true,
}

Bracket Pair Colorizer 插件可以為不同的代碼括號配對設置不同的顏色，並幫助你更好的辨認它們。

3. REST Client：

{
   "rest-client.environmentVariables": {
      "$shared": {
         "baseUrl": "https://jsonplaceholder.typicode.com"
      }
   }
}

REST Client 可以在編輯器中發送 HTTP 請求，方便地測試 API，它還可以方便地將請求保存到文件中，以便日後檢查。

總結：

以上簡單介紹了幾個常用的 Vscode 插件，希望可以幫助到你在編寫代碼時更加快速地完成開發工作。