VS Code 配置指南

Visual Studio Code 是微软开源的代码编辑器，支持扩展、远程开发和多语言工作流。

这页只记录安装、扩展、常用配置和远程开发方式。

安装

winget install Microsoft.VisualStudioCode

推荐扩展

推荐安装顺序

建议不要一上来装几十个扩展，比较稳妥的节奏是：

1. 先装语言官方扩展和格式化工具
2. 再装 Git、错误提示、路径补全等增强类扩展
3. 最后按场景补远程开发、容器、主题图标

扩展装得越多，启动速度、补全质量和冲突概率都越容易受影响。尤其是同类格式化器、同类 AI 扩展、同类语法高亮，尽量避免重复。

通用开发

前端开发

外观

先按开发场景选扩展

如果你只想先装最有收益的一小组，可以按场景精简：

• 前端 / Nuxt / Vue：Vue - Official、Prettier、UnoCSS
• 通用脚本 / 运维：Error Lens、Todo Tree、Path Intellisense
• 重度 Git 协作：GitLens
• 远程开发：Remote - SSH、WSL、Dev Containers

实用配置

在 settings.json 中添加：

{
  "editor.fontSize": 14,
  "editor.fontFamily": "'Cascadia Code', 'Fira Code', Consolas",
  "editor.fontLigatures": true,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": "active",
  "editor.minimap.enabled": false,
  "editor.smoothScrolling": true,
  "editor.cursorSmoothCaretAnimation": "on",
  "workbench.list.smoothScrolling": true,
  "files.autoSave": "onFocusChange",
  "terminal.integrated.defaultProfile.windows": "PowerShell"
}

工作区级建议

个人偏好适合放用户级配置，但团队协作时，下面这些更适合放进仓库：

• .vscode/extensions.json：推荐统一扩展清单
• .vscode/settings.json：统一格式化器、缩进、换行、保存行为
• .editorconfig：跨编辑器的缩进与行尾规则

这样做的好处是：新同事进仓库时能更快对齐，不需要每个人自己猜项目规范。

常用快捷键

进阶技巧

多光标编辑

• Alt + Click 添加光标
• Ctrl + Alt + ↑/↓ 上下添加光标
• Ctrl + Shift + L 选中所有匹配项

代码片段

创建自定义代码片段：Ctrl + Shift + P → Snippets: Configure User Snippets

{
  "Vue 3 Setup": {
    "prefix": "v3setup",
    "body": [
      "<template>",
      "  <div>$1</div>",
      "</template>",
      "",
      "<script setup lang=\"ts\">",
      "$2",
      "</script>"
    ]
  }
}

远程开发

• WSL 扩展：在 WSL 中使用 VS Code
• Remote - SSH：连接远程服务器编辑
• Dev Containers：在 Docker 容器中开发

远程开发怎么选

三种模式各有定位：

• WSL：最适合 Windows 本地开发 Linux 项目，性能和终端体验通常最好
• Remote - SSH：适合直接维护远程服务器、云主机或实验机
• Dev Containers：适合团队统一开发环境，尤其是多服务或依赖复杂的项目

如果你平时主要是 Windows + Node.js / Python / Docker，本地代码放 WSL 文件系统里，再用 VS Code 的 WSL 模式，通常是最稳的组合。

常见问题

保存时格式化结果不一致

先检查：

• 是否同时装了多个 formatter
• 项目里有没有工作区级 formatter 配置
• Prettier、ESLint、语言扩展是否在抢同一种文件的格式化权

终端编码或字体显示异常

• Windows 下优先使用 PowerShell 或 Windows Terminal
• 字体推荐使用支持连字和 Nerd Font 的等宽字体
• 中英文混排多时，注意字体 fallback 是否正常

WSL 项目很慢

如果仓库放在 C:\\ 再通过 WSL 打开，文件监听和依赖安装常常会变慢。更推荐把项目放在 WSL 的 Linux 文件系统中，例如 ~/projects/app。

延伸阅读

• Windows 重装部署清单
• Windows 重装部署清单（详情）
• Windows 快捷键与效率操作
• PowerShell 实用技巧
• 本地开发环境搭建

参考链接

• VS Code 官网 — 下载与文档
• VS Code GitHub — 源码
• VS Code 快捷键 PDF — Windows 版
• 扩展市场 — 搜索扩展