🚀 VSCode 必备插件推荐

Visual Studio Code 是目前最流行的代码编辑器之一,丰富的插件生态让它更加强大。

通用插件

1. Chinese (Simplified) Language Pack

功能: 中文语言包
推荐指数: ⭐⭐⭐⭐⭐

让 VSCode 界面变成中文,对中文用户更友好。

2. GitHub Copilot

功能: AI 代码助手
推荐指数: ⭐⭐⭐⭐⭐

基于 AI 的代码补全工具,大幅提升编码效率。

3. GitLens

功能: Git 增强工具
推荐指数: ⭐⭐⭐⭐⭐

特性:

  • 显示每行代码的提交信息
  • 可视化代码历史
  • 强大的 Git 操作界面

4. Prettier

功能: 代码格式化
推荐指数: ⭐⭐⭐⭐⭐

自动格式化代码,保持代码风格统一。

配置:

{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true
}

5. ESLint

功能: JavaScript/TypeScript 代码检查
推荐指数: ⭐⭐⭐⭐⭐

实时检查代码错误和潜在问题。

主题与美化

1. One Dark Pro

功能: 主题
推荐指数: ⭐⭐⭐⭐⭐

最受欢迎的暗色主题之一。

2. Material Icon Theme

功能: 文件图标
推荐指数: ⭐⭐⭐⭐⭐

美观的文件图标,一眼识别文件类型。

3. Bracket Pair Colorizer 2

功能: 括号着色
推荐指数: ⭐⭐⭐⭐

不同层级的括号用不同颜色显示,提高可读性。

前端开发

1. Live Server

功能: 本地开发服务器
推荐指数: ⭐⭐⭐⭐⭐

一键启动本地服务器,实时预览网页。

2. Auto Rename Tag

功能: 自动重命名标签
推荐指数: ⭐⭐⭐⭐⭐

修改 HTML/XML 标签时,自动同步修改配对标签。

3. CSS Peek

功能: CSS 快速查看
推荐指数: ⭐⭐⭐⭐

快速查看 CSS 定义,支持跳转。

4. Tailwind CSS IntelliSense

功能: Tailwind CSS 智能提示
推荐指数: ⭐⭐⭐⭐⭐

使用 Tailwind CSS 的必备插件。

Python 开发

1. Python

功能: Python 支持
推荐指数: ⭐⭐⭐⭐⭐

官方 Python 插件,提供完整的 Python 开发支持。

2. Pylance

功能: Python 语言服务器
推荐指数: ⭐⭐⭐⭐⭐

更快的 Python 智能提示和类型检查。

3. Jupyter

功能: Jupyter Notebook 支持
推荐指数: ⭐⭐⭐⭐⭐

在 VSCode 中直接使用 Jupyter Notebook。

Markdown 写作

1. Markdown All in One

功能: Markdown 增强
推荐指数: ⭐⭐⭐⭐⭐

特性:

  • 键盘快捷键
  • 自动生成目录
  • 列表自动编号
  • 预览增强

2. Markdown Preview Enhanced

功能: Markdown 预览增强
推荐指数: ⭐⭐⭐⭐

支持数学公式、图表等高级特性。

3. Paste Image

功能: 快速粘贴图片
推荐指数: ⭐⭐⭐⭐

从剪贴板直接粘贴图片到 Markdown。

远程开发

1. Remote - SSH

功能: SSH 远程开发
推荐指数: ⭐⭐⭐⭐⭐

通过 SSH 连接远程服务器进行开发。

2. Remote - Containers

功能: 容器开发
推荐指数: ⭐⭐⭐⭐⭐

在 Docker 容器中开发。

3. Remote - WSL

功能: WSL 开发
推荐指数: ⭐⭐⭐⭐⭐

在 Windows 子系统 Linux 中开发。

效率工具

1. Path Intellisense

功能: 路径智能提示
推荐指数: ⭐⭐⭐⭐⭐

自动补全文件路径。

2. TODO Highlight

功能: TODO 高亮
推荐指数: ⭐⭐⭐⭐

高亮显示 TODO、FIXME 等标记。

3. Better Comments

功能: 注释增强
推荐指数: ⭐⭐⭐⭐

用不同颜色区分不同类型的注释。

4. Code Spell Checker

功能: 拼写检查
推荐指数: ⭐⭐⭐⭐

检查代码中的拼写错误。

5. Error Lens

功能: 错误内联显示
推荐指数: ⭐⭐⭐⭐

在代码行内直接显示错误信息。

数据库工具

1. SQLTools

功能: 数据库管理
推荐指数: ⭐⭐⭐⭐⭐

在 VSCode 中管理数据库,支持多种数据库。

2. MongoDB for VS Code

功能: MongoDB 客户端
推荐指数: ⭐⭐⭐⭐

直接在 VSCode 中操作 MongoDB。

其他实用插件

1. Settings Sync

功能: 设置同步
推荐指数: ⭐⭐⭐⭐⭐

同步你的 VSCode 设置、插件、快捷键等。

2. Project Manager

功能: 项目管理
推荐指数: ⭐⭐⭐⭐

快速切换不同的项目。

3. REST Client

功能: HTTP 请求测试
推荐指数: ⭐⭐⭐⭐

在 VSCode 中测试 API 接口。

4. Draw.io Integration

功能: 画图工具
推荐指数: ⭐⭐⭐⭐

在 VSCode 中绘制流程图、架构图等。

推荐配置

settings.json 配置示例:

{
  "editor.fontSize": 14,
  "editor.lineHeight": 22,
  "editor.fontFamily": "'Fira Code', 'Courier New', monospace",
  "editor.fontLigatures": true,
  "editor.tabSize": 2,
  "editor.renderWhitespace": "boundary",
  "editor.minimap.enabled": true,
  "editor.cursorBlinking": "smooth",
  "editor.formatOnSave": true,
  "editor.suggestSelection": "first",
  
  "workbench.colorTheme": "One Dark Pro",
  "workbench.iconTheme": "material-icon-theme",
  "workbench.startupEditor": "none",
  
  "files.autoSave": "afterDelay",
  "files.autoSaveDelay": 1000,
  "files.trimTrailingWhitespace": true,
  
  "terminal.integrated.fontSize": 13,
  "terminal.integrated.fontFamily": "MesloLGS NF"
}

快捷键推荐

Ctrl/Cmd + P       # 快速打开文件
Ctrl/Cmd + Shift + P  # 命令面板
Ctrl/Cmd + `       # 打开终端
Ctrl/Cmd + B       # 切换侧边栏
Ctrl/Cmd + /       # 注释/取消注释
Alt + ↑/↓         # 移动行
Shift + Alt + ↑/↓  # 复制行
Ctrl/Cmd + D       # 选择下一个相同内容
Ctrl/Cmd + F       # 查找
Ctrl/Cmd + H       # 替换

插件安装方法

方法 1:界面安装

  1. 点击左侧扩展图标
  2. 搜索插件名称
  3. 点击"安装"

方法 2:命令行安装

code --install-extension publisher.extension-name

性能优化建议

  1. 不要安装太多插件 - 会影响性能
  2. 定期清理 - 卸载不用的插件
  3. 禁用不需要的插件 - 针对特定工作区禁用
  4. 使用工作区推荐 - 团队协作时统一插件

总结

选择合适的插件可以大幅提升开发效率,但也要注意不要装太多。根据自己的需求选择最合适的插件组合。


你最喜欢的 VSCode 插件是什么?欢迎在评论区分享!

插件列表会持续更新…