---

1：必装

（1） chinese（简体中文，英文好的可以忽略）

插件名：Chinese (Simplified) (简体中文) Language Pack
作用：将vscode变成中文，当然你也可以下载繁体中文或其他

（2）GitLens（查看代码提交记录）

插件名：GitLens — Git supercharged
作用：能看具体哪一行代码是谁什么时候提交的

（3）Git Graph（可视化git）

插件名：Git Graph
作用：查看存储库的 Git Graph，并从该图中轻松执行 Git 操作。可配置为您想要的外观！具体的操作有创建、删除、合并分支，提交代码，拉去代码…你可以理解为vscode版的图形操作git

（4）Color Manager（内置颜色选择器）

插件名：Color Manager
作用：一个颜色选择器（让你的二进制，rgb/rgba颜色旁边有颜色显示，点击后可以修改你想要的颜色）

（5）Browse Lite （浏览精简版）

插件名：Browse Lite
作用：Browse Lite 浏览精简版，如下图

（6）Auto Import（ts和tsx的代码补全）

插件名：Auto Import
作用：自动查找、解析并为所有可用导入提供代码作和代码补全。适用于 Typescript 和 TSX。

（7）BasedPyright（类型检查改进）

插件名：BasedPyright
作用：具有各种类型检查改进、pylance 功能等。详细请查看文档

（8）Beautify css/sass/scss/less（美化各种css代码）

插件名：Beautify css/sass/scss/less
作用：美化 css、sass 和 less 代码（Visual Studio Code 的扩展）

（9）npm Intellisense（自动联想npm包）

插件名：npm Intellisense
作用：用于自动完成 import 语句中的 npm 模块。如下图自动联想到导入的包。

（10）Path Intellisense （自动联想路径）

插件名：Path Intellisense
作用： 路径智能感知，和上面的类似，不过这个是引入js/css/vue文件的路径自动感知

（11）Python （python扩展）

插件名：Python
作用：Visual Studio Code 的 Python 扩展。为扩展提供无缝集成的访问点，并支持 IntelliSense （Pylance）、调试 （Python 调试器）、格式化、linting、代码导航、重构、变量资源管理器、测试资源管理器等！

（12）Python Debugger（python扩展）

插件名：Python
作用：支持使用 debugpy 进行 Python 调试。Python 调试器允许您设置断点、单步执行代码、检查变量以及执行其他基本调试任务，从而提供无缝的调试体验。debugpy 扩展为各种类型的 Python 应用程序提供调试支持，包括脚本、Web 应用程序、远程进程和多线程进程。

2：常用

我平常使用的项目为 vue3 + vite + ant design vue + tailwindcss/unocss， 所以还需要安装以下插件。 tailwindcss和unocss的区别这里不做解释，自己了解即可。

（1.1）Vue (Official)

插件名：Vue (Official)
作用：官方推出的Vue 的语言支持。为 Vue 单文件组件提供了开箱即用的格式化功能。

（1.2）Vue 3 Snippets

插件名：Vue 3 Snippets
作用：这个插件包含了所有的 Vue.js 2 和 Vue.js 3 的 api 对应的代码片段

（1.3）Vue 3 Support - All In One

插件名：Vue 3 Support - All In One
作用：Vue3 片段，包含 vue2 和 vue3 中常用的代码突出显示、代码片段和格式

（2）Vetur

插件名：Vetur
作用：语法高亮、智能代码补全、代码片段、代码导航、代码格式化、语法检查(集成了ESLint和TSLint监测语法错误)

（3）Vite

插件名：Vite
作用：启动、调试、构建项目

（4）Vue i18n

插件名：Vue i18n
作用：提取并自动翻译文案、直观的看到对应的翻译文案、通过翻译中心管理翻译

（5）i18n Ally

插件名：i18n Ally
作用：适用于 VS Code 的多合一 i18n 扩展。内联注释、悬停直接翻译、在一个地方管理所有翻译、从代码中提取翻译、报告缺少翻译、机器翻译、JSON 和 YAML 的注释等…

（6）Prettier - Code formatter（代码格式化）

插件名：Prettier - Code formatter
作用： Prettier代码格式化程序（保存时自动格式化）

（7）Prettier ESLint（代码eslint 格式化）

插件名：Prettier ESLint
作用：使用 prettier-eslint 包格式化 JavaScript 和 Typescript 代码的 Visual Studio 扩展
1️⃣此扩展要求在本地或全局安装以下 NPM 包：

prettier@^3.1.0
eslint@^8.52.0
prettier-eslint@^16.1.2
@typescript-eslint/parser@^5.0.1 and typescript@^4.4.4 //  仅适用于 TypeScript 项目
vue-eslint-parser@^8.0.0 // 仅适用于 Vue 项目

2️⃣还需要在根目录的 .vscode/settings.json 文件中，复制并粘贴以下设置

{
    "editor.defaultFormatter": "rvest.vs-code-prettier-eslint",
    "editor.formatOnType": false, // required
    "editor.formatOnPaste": true, // optional
    "editor.formatOnSave": true, // optional
    "editor.formatOnSaveMode": "file", // required to format on save
    "files.autoSave": "onFocusChange", // optional but recommended
    "vs-code-prettier-eslint.prettierLast": false // set as "true" to run 'prettier' last not first
  }

3️⃣重启vscode

（8）ESLint（eslint配置）

插件名：ESLint
作用：将 ESLint JavaScript 集成到 VS Code 中
注意点：在新文件夹上，您可能还需要创建一个 .eslintrc 配置文件。您可以通过使用 VS Code 命令创建 ESLint 配置或在终端中使用 npx eslint --init 运行 eslint 命令来执行此作。

（9）Tailwind CSS IntelliSense（不必须）

插件名：Tailwind CSS IntelliSense
作用：提供自动完成、语法突出显示和 智能代码补全 等功能来增强 Tailwind 开发体验。

（10）UnoCSS（不必须）

插件名：UnoCSS
作用： 提供自动完成、语法突出显示和 智能代码补全 等功能来增强 UnoCSS 开发体验。
文档：https://unocss.dev/integrations/vscode

（11）Ant Design Vue helper（不必须）

插件名：Ant Design Vue helper
作用：ant-design-vue-helper 是 Ant Design Vue 的 VS Code 扩展。其实和上两个一样，有自动完成、代码补全等功能。

3：AI（选择使用，不用也行）

作用：提供 代码智能生成、智能问答、多文件修改、编程智能体 等能力，为开发者带来高效、流畅的编码体验。

（1）Open AI 开发的 GitHub Copilot（推荐）

插件名：GitHub Copilot 和 GitHub Copilot Chat 两者一起使用的
GitHub Copilot - 在键入时提供内联编码建议。
GitHub Copilot Chat - 提供对话式 AI 帮助的配套扩展。

（2） 腾讯云代码助手

插件名：Tencent Cloud CodeBuddy

（3） 阿里巴巴开发的通义灵码

插件名：Lingma - Alibaba Cloud AI Coding Assistant

（4）百度的文心快码

插件名：Lingma - Alibaba Cloud AI Coding Assistant

总结(插件截图)