VS Code 插件

VS Code 常用插件集合

[TOC]

### 1. 汉化插件

![](/UploadFiles/images/20211214/6377508919257035762970135.png)

### 2. Markdown

#### 2.1. Markdown All in One & Markdown Preview Enhanced

+ Markdown All in One：实现一些基础的 Markdown 编写体验，比如快捷键、列表编辑、自动生成目录等等

+ Markdown Preview Enhanced：实现 github 风格的预览、支持导出为 HTML、PDF 等

![](/UploadFiles/images/20211214/6377508919995247703989906.png)

#### 2.3. Markdown Image

Markdown 图床插件

![](/UploadFiles/images/20220323/6378363038657239174138778.png)

#### 2.4. markdownlint

Markdown 语法提示、智能纠错等

![](/UploadFiles/images/20220323/6378363040727728836197261.png)

### 3. 右键菜单浏览器打开html

open in Browser 插件可以让静态html文件右键在浏览器打开

![](/UploadFlie/MarkdownImg/20230530/202305300311568790.png)

### 4. art-template模板代码高亮插件
![](/UploadFlie/MarkdownImg/20230628/202306280208523246.png)

### 5. Git Graph管理Git图形化插件
![](/UploadFlie/MarkdownImg/20230811/202308111052093191.png)

### 6. Draw.io Integration 图形绘制插件
![](/UploadFlie/MarkdownImg/20231007/202310071150037333.png)

### 7. Epub格式文件阅读插件

![](/UploadFlie/MarkdownImg/20251229/202512291032280560.png)

### 8. 翻译插件

![](/UploadFlie/MarkdownImg/20260612/202606121146095720.png)

### 9. pdf 阅读

![](/UploadFlie/MarkdownImg/20260612/202606121153095045.png)

### 10. VUE 开发

#### 10.1. Vue - Official (原 Volar)

![](/UploadFlie/MarkdownImg/20260612/202606120444534652.png)

+ 作用：Vue 3的官方语言支持插件，提供语法高亮、类型检查、智能提示，完美支持`<script setup>`和 TypeScript。
+ 注意：如果你之前安装过 Vetur (Vue 2时代的插件)，请务必先卸载，两者会冲突。Vue 3项目请认准 Vue -Official.

#### 10.2. Vue VSCode Snippets

Vue 3 代码片段的插件

![](/UploadFlie/MarkdownImg/20260612/202606120516133563.png)

#### 10.3. Prettier - Code formatte

![](/UploadFlie/MarkdownImg/20260612/202606120542282805.png)

+ 功能：一个代码格式化工具，支持多种语言，可以帮助你格式化代码，使其更加整洁和一致。

#### 10.4. Path Intellisense

+ 功能：自动完成文件名。当你在JavaScript、TypeScript或任何其他语言中使用路径时，这个插件会提供自动完成功能，非常适合在处理模块导入时使用。

![](/UploadFlie/MarkdownImg/20260612/202606120503331450.png)

#### 10.5. ESLint

+ 功能：ESLint是一个插件化JavaScript和JSX检查工具，它可以用来识别和报告JavaScript代码中的模式匹配问题。配合.eslintrc配置文件，可以确保代码风格的一致性。

> 通常还需要安装一个针对Vue的ESLint插件，如eslint-plugin-vue。
使用`管理员身份`（未使用管理员身份安装可能会报错无权限之类）打开cmd窗口，运行下面命令进行全局安装
```bash
npm install -g eslint-plugin-vue
# 安装完在当前nodejs版本目录中可以看到：C:\Program Files (x86)\dev\nodejs\node_modules\eslint-plugin-vue
```

![](/UploadFlie/MarkdownImg/20260612/202606120500341443.png)