vscode需要安装的插件有哪些

发布时间：2023-05-20

在开发过程中，编辑器的功能越强大，对于提升开发效率就越有帮助。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 插件，希望可以帮助到你在编写代码时更加快速地完成开发工作。

推荐文章