VS Code 完全指南 | 高效开发技巧、快捷键与配置优化教程

Visual Studio Code Development

Visual Studio Code（简称 VS Code）是微软开发的免费、开源、跨平台代码编辑器。凭借其丰富的扩展生态、强大的调试功能和高度可定制性，VS Code 已成为全球开发者最喜爱的开发工具之一。本文将详细介绍 VS Code 的高级使用技巧、配置优化和效率提升方法。

为什么选择 VS Code？

核心优势

优势	说明
🆓 完全免费	开源项目，无隐藏费用
🌍 跨平台	Windows、macOS、Linux 全支持
🔌 丰富扩展	30,000+ 插件覆盖所有编程语言
⚡ 轻量快速	启动速度快，资源占用低
🎨 高度定制	主题、快捷键、布局随心配置
🛠️ 内置工具	Git 集成、终端、调试器一应俱全
🤝 强大社区	活跃社区，问题快速解决

适用场景

✅ 前端开发：HTML、CSS、JavaScript、TypeScript、Vue、React ✅ 后端开发：Node.js、Python、Go、Java、PHP ✅ 移动开发：React Native、Flutter ✅ 数据科学：Jupyter Notebook、Python 数据分析 ✅ DevOps：Docker、Kubernetes、Terraform ✅ 文档编写：Markdown、LaTeX

命令行工具

command+shift+p 打开 Command Palette (命令面板) 输入 shell command，点击回车

使用 VS code 打开当前文件夹 code .

`code -r .`	在最近使用的代码窗口打开当前文件夹
`code -n`	创建新文件
`code --locale=es`	修改语言
`code --diff file1 file2`	打开 diff 编辑器
`code --help`	查看帮助
`code --disable-extensions .`	禁用所有的插件

命令行工具详解

安装命令行工具

macOS：

bash

# 方法 1：通过命令面板安装
Cmd + Shift + P → 输入 "Shell Command" 
→ 选择 "Install 'code' command in PATH"

# 方法 2：手动添加（如果方法 1 失败）
echo 'export PATH="/Applications/Visual Studio Code.app/Contents/Resources/app/bin:$PATH"' >> ~/.zshrc
source ~/.zshrc

Windows：

powershell

# VS Code 安装时默认添加到 PATH
# 如果没有，重新运行安装程序并勾选 "Add to PATH"

# 或者手动添加环境变量
# 系统属性 → 高级 → 环境变量
# 在 Path 中添加：
C:\Users\你的用户名\AppData\Local\Programs\Microsoft VS Code\bin

Linux：

bash

# Debian/Ubuntu
sudo apt install code

# 或通过 Snap
sudo snap install code --classic

# Fedora
sudo dnf install code

# Arch Linux
sudo pacman -S code

常用命令详解

基础命令：

bash

# 打开当前目录
code .

# 打开指定文件或目录
code /path/to/file
code /path/to/directory

# 在新窗口中打开
code -n .

# 在已存在的窗口中打开
code -r .

# 打开文件并定位到指定行
code file.txt:10

# 打开文件并定位到行和列
code file.txt:10:5

高级命令：

bash

# 比较两个文件
code --diff file1.js file2.js

# 以特定语言模式打开
code --locale zh-CN

# 禁用所有扩展启动（排查问题用）
code --disable-extensions .

# 禁用特定扩展
code --disable-extension vscode.python

# 显示版本信息
code --version

# 显示帮助信息
code --help

# 等待文件关闭后返回（用于 git commit 等）
code --wait file.txt

实用场景示例：

bash

# 1. 快速编辑配置文件
code ~/.zshrc
code ~/.bashrc

# 2. 比较 Git 分支差异
code --diff <(git show branch1:file.js) <(git show branch2:file.js)

# 3. 作为默认编辑器
export EDITOR="code --wait"
git config --global core.editor "code --wait"

# 4. 批量打开文件
code src/*.js

# 5. 打开多个目录（多根工作区）
code folder1 folder2 folder3

创建别名（提升效率）：

bash

# 添加到 ~/.zshrc 或 ~/.bashrc
alias c='code'
alias cn='code -n'
alias cr='code -r'
alias cdif='code --diff'

# 重新加载
source ~/.zshrc

# 使用
c .          # 打开当前目录
cn           # 新建窗口
cdif a.js b.js  # 比较文件

自定义设置

打开 settings.json

`"editor.formatOnPaste": true`	粘贴时格式化
`"editor.fontSize": 18`	改变字体大小
`"window.zoomLevel": 5`	设置缩放等级
`"editor.fontFamily": "Fira Code", "editor.fontLigatures": true`	编程字体连字
`"files.autoSave": "afterDelay"`	自动保存
`"editor.formatOnSave": true,`	保存时格式化
`"editor.tabSize": 4`	修改 tab 长度
`"editor.renderWhitespace": "all"`	空白符号显示

Settings.json 完整配置指南

如何打开 settings.json

方法 1：命令面板
Cmd/Ctrl + Shift + P → 输入 "Open Settings (JSON)"

方法 2：菜单
文件 → 首选项 → 设置 → 右上角图标 "{}"

方法 3：快捷键
Cmd/Ctrl + , → 点击右上角图标

编辑器核心配置

json

{
  // ========== 基础外观 ==========
  "editor.fontSize": 16,
  "editor.fontFamily": "'Fira Code', 'JetBrains Mono', Consolas, monospace",
  "editor.fontLigatures": true,
  "editor.lineHeight": 24,
  "editor.lineNumbers": "on",
  "editor.rulers": [80, 120],
  
  // ========== 缩进与空格 ==========
  "editor.tabSize": 2,
  "editor.insertSpaces": true,
  "editor.detectIndentation": false,
  "editor.renderWhitespace": "boundary",
  
  // ========== 自动保存与格式化 ==========
  "files.autoSave": "afterDelay",
  "files.autoSaveDelay": 1000,
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "editor.formatOnType": true,
  
  // ========== 代码折叠 ==========
  "editor.folding": true,
  "editor.foldingStrategy": "indentation",
  
  // ========== 智能提示 ==========
  "editor.quickSuggestions": {
    "other": true,
    "comments": false,
    "strings": false
  },
  "editor.suggestOnTriggerCharacters": true,
  "editor.acceptSuggestionOnEnter": "on",
  
  // ========== 光标与选择 ==========
  "editor.cursorBlinking": "smooth",
  "editor.cursorSmoothCaretAnimation": "on",
  "editor.multiCursorModifier": "ctrlCmd",
  "editor.selectionHighlight": true,
  
  // ========== 滚动与导航 ==========
  "editor.smoothScrolling": true,
  "editor.scrollBeyondLastLine": false,
  "editor.minimap.enabled": true,
  "editor.minimap.side": "right",
  
  // ========== 括号匹配 ==========
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": true,
  
  // ========== 其他优化 ==========
  "editor.wordWrap": "on",
  "editor.trimAutoWhitespace": true,
  "files.trimTrailingWhitespace": true,
  "files.insertFinalNewline": true
}

工作台配置

json

{
  // ========== 主题与外观 ==========
  "workbench.colorTheme": "One Dark Pro",
  "workbench.iconTheme": "material-icon-theme",
  "workbench.startupEditor": "newUntitledFile",
  
  // ========== 侧边栏 ==========
  "workbench.activityBar.location": "top",
  "workbench.sideBar.location": "left",
  "workbench.statusBar.visible": true,
  
  // ========== 面包屑导航 ==========
  "breadcrumbs.enabled": true,
  "breadcrumbs.filePath": "on",
  "breadcrumbs.symbolPath": "on",
  
  // ========== Zen 模式 ==========
  "zenMode.hideStatusBar": true,
  "zenMode.hideActivityBar": true,
  
  // ========== 搜索配置 ==========
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/*.code-search": true,
    "**/dist": true,
    "**/build": true
  }
}

文件关联配置

json

{
  // ========== 文件编码 ==========
  "files.encoding": "utf8",
  "files.eol": "\n",
  
  // ========== 文件排除 ==========
  "files.exclude": {
    "**/.git": true,
    "**/.DS_Store": true,
    "**/node_modules": true
  },
  
  // ========== 文件关联 ==========
  "files.associations": {
    "*.vue": "vue",
    "*.wxml": "html",
    "*.wxss": "css",
    ".env.*": "properties"
  }
}

语言特定配置

json

{
  // ========== JavaScript/TypeScript ==========
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.tabSize": 2
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.tabSize": 2
  },
  
  // ========== Python ==========
  "[python]": {
    "editor.defaultFormatter": "ms-python.black-formatter",
    "editor.tabSize": 4,
    "editor.codeActionsOnSave": {
      "source.organizeImports": "explicit"
    }
  },
  
  // ========== JSON ==========
  "[json]": {
    "editor.defaultFormatter": "vscode.json-language-features",
    "editor.tabSize": 2
  },
  
  // ========== Markdown ==========
  "[markdown]": {
    "editor.wordWrap": "on",
    "editor.quickSuggestions": false
  }
}

扩展配置

json

{
  // ========== Git ==========
  "git.autofetch": true,
  "git.confirmSync": false,
  "git.enableSmartCommit": true,
  "git.openRepositoryInParentFolders": "always",
  
  // ========== Emmet ==========
  "emmet.includeLanguages": {
    "vue": "html",
    "javascript": "javascriptreact"
  },
  
  // ========== Terminal ==========
  "terminal.integrated.defaultProfile.osx": "zsh",
  "terminal.integrated.fontSize": 14,
  "terminal.integrated.cursorBlinking": true
}

字体	特点	下载
Fira Code	连字支持好，开源免费	GitHub
JetBrains Mono	专为阅读代码设计	JetBrains
Cascadia Code	微软出品，Windows 友好	GitHub
Source Code Pro	Adobe 出品，经典选择	Adobe Fonts
Hack	清晰易读，开源免费	Source Foundry
Monaco	macOS 默认，简洁优雅	系统自带

VSCode 查找和替换正则表达式转义字符

`\t`	tab
`\r`	回车符号\r
`\n`	换行符号\n
`\uxxxx`	匹配 Unicode 编码为 xxx 的字符,如\u0020 匹配空格，这个符号可以用来帮助匹配中文，后面说
`\`	特殊符号转义，如"" ，转义后匹配的是字符""， “(” 匹配的是括号"("
`[字符序列]`	匹配[ ]中的任意字符，如[ae]，字符 a 和字符 e 均匹配
`[^字符序列]`	匹配不在[ ]中的任意字符，如[^ae]除了 a 和 e，其他字符都匹配
`[字符 1-字符 2]`	匹配在[ ]之间的任意字符，如[a-x]，就是匹配 a 和 x 之间的所有字符（包括 a 和 x）
`.`	匹配任意单个字符(除了\n)
`\w`	匹配所有单词字符（如"a"，“3”，“E”，但不匹配"?"，"."等）
`\W`	和\w 相反，匹配所有非单词字符
`[\u4e00-\u9fa5]`	利用区间和\u 转义符号，匹配中文（该区间包含 2 万个汉字），可以当做中文版的\w 使用
`\s`	匹配空格
`\S`	和\s 相反，匹配非空格
`\d`	匹配数字字符，如"1"，“4”，"9"等
`\D`	和\d 相反，匹配除了数字字符外的其他字符
`*`	将前面的元素匹配 0 到多次，如"\d*.\d"，可以匹配"19.9"，".0",“129.9”
`+`	将前面的元素匹配 1 到多次，如"be+"，可以匹配"be"， “beeeeee”
`？`	将前面的元素匹配 0 次或者一次，如"rai?n" 可以且只可以匹配 “ran” 或者 “rain”
	n 是个数字，将前面的元素匹配 n 次，如"be{3}“可以且只可以匹配 ”beee”
	将前面的元素匹配至少 n 次，最多 m 次，如"be{1,3}" 可以且只可以匹配"be",“bee”, “beee”
`\|`	相当于"或",表示匹配由
`$n`	n 是个数字，这个是替换时使用括号（）将匹配的 patter 分割成了几个元素，然后在替换的 patter 里面使用，类似于变量。如果查找 patter 是"(\w+)(\s)(\w+)",那么$1 就是(\w+),$2 是(\s),$3 是(\w+)，替换 patter 是$3$2$1,那么替换结果就是(\w+)(\s)(\w+)。假设匹配到的是"one two"，那么$1,$2,$3 分别为"one", " “, “two”，替换后的结果为"two one”.

正则表达式实战示例

常用正则模式

regex

# 匹配邮箱
\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b

# 匹配 URL
https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)

# 匹配 IPv4 地址
\b(?:[0-9]{1,3}\.){3}[0-9]{1,3}\b

# 匹配日期 (YYYY-MM-DD)
\b\d{4}-\d{2}-\d{2}\b

# 匹配时间 (HH:MM:SS)
\b\d{2}:\d{2}:\d{2}\b

# 匹配手机号（中国）
\b1[3-9]\d{9}\b

# 匹配身份证号（中国）
\b\d{17}[\dXx]\b

# 匹配 HTML 标签
<([a-z]+)([^<]+)*(?:>(.*)<\/\1>|\s+\/>)

# 匹配注释
\/\/.*$|\/\*[\s\S]*?\*\/

# 匹配函数定义
function\s+(\w+)\s*\([^)]*\)

# 匹配 import 语句
import\s+.*?from\s+['"].*?['"]

查找替换实战

示例 1：统一引号风格

查找：'([^']*)'
替换："$1"
说明：将单引号改为双引号

示例 2：删除行尾空格

查找：\s+$
替换：（空）
说明：删除每行末尾的空格和 Tab

示例 3：交换名字顺序

查找：(\w+)\s+(\w+)
替换：$2 $1
说明："John Doe" → "Doe John"

示例 4：提取中文

查找：[^\u4e00-\u9fa5]
替换：（空）
说明：删除所有非中文字符

示例 5：格式化 CSS 颜色

查找：#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])\b
替换：#$1$1$2$2$3$3
说明：简写颜色展开 #fff → #ffffff

示例 6：批量重命名变量

查找：\boldVarName\b
替换：newVarName
说明：精确匹配整个单词，避免部分匹配

正则测试工具

在线工具：

VS Code 内置测试：

1. Cmd/Ctrl + F 打开查找
2. 点击 .* 图标启用正则
3. 输入正则表达式
4. 高亮显示匹配项

技巧

一次更改所有类似单词	`Ctrl+Shift+L`
将光标移到行的末尾和开头	`Alt + Shift + I`
代码折叠	`Ctrl + Shift + [` `Ctrl + Shift + ]`

必备快捷键大全

通用快捷键

功能	macOS	Windows/Linux
命令面板	Cmd+Shift+P	Ctrl+Shift+P
快速打开文件	Cmd+P	Ctrl+P
设置	Cmd+,	Ctrl+,
侧边栏切换	Cmd+B	Ctrl+B
终端开关	Ctrl+`	Ctrl+`
查找	Cmd+F	Ctrl+F
替换	Cmd+H	Ctrl+H
全局查找	Cmd+Shift+F	Ctrl+Shift+F
撤销	Cmd+Z	Ctrl+Z
重做	Cmd+Shift+Z	Ctrl+Y
保存	Cmd+S	Ctrl+S
全选	Cmd+A	Ctrl+A
复制	Cmd+C	Ctrl+C
粘贴	Cmd+V	Ctrl+V
剪切	Cmd+X	Ctrl+X

编辑快捷键

功能	macOS	Windows/Linux
复制行	Shift+Alt+↓	Shift+Alt+↓
移动行	Alt+↑/↓	Alt+↑/↓
删除行	Cmd+Shift+K	Ctrl+Shift+K
注释代码	Cmd+/	Ctrl+/
块注释	Cmd+Shift+/	Ctrl+Shift+/
缩进	Cmd+]	Ctrl+]
取消缩进	Cmd+[	Ctrl+[
跳转到行	Ctrl+G	Ctrl+G
查找引用	Shift+F12	Shift+F12
重命名符号	F2	F2

导航快捷键

功能	macOS	Windows/Linux
跳转到定义	F12	F12
Peek 定义	Alt+F12	Alt+F12
返回上一个位置	Ctrl+-	Alt+←
前进到下一个位置	Ctrl+Shift+-	Alt+→
切换到文件	Cmd+P	Ctrl+P
切换到符号	Cmd+Shift+O	Ctrl+Shift+O
大纲视图	Cmd+Shift+O	Ctrl+Shift+O
面包屑导航	Cmd+Shift+.	Ctrl+Shift+.

多光标操作

功能	macOS	Windows/Linux
添加下一个匹配	Cmd+D	Ctrl+D
选择所有匹配	Cmd+Shift+L	Ctrl+Shift+L
添加光标	Option+Click	Alt+Click
列选择	Shift+Option+拖动	Shift+Alt+拖动
撤销上一个光标	Cmd+U	Ctrl+U

窗口管理

功能	macOS	Windows/Linux
拆分编辑器	Cmd+\	Ctrl+\
切换编辑器组	Cmd+1/2/3	Ctrl+1/2/3
移动编辑器	Cmd+Shift+P → Move	Ctrl+Shift+P → Move
最大化编辑器	Cmd+K Z	Ctrl+K Z
关闭编辑器	Cmd+W	Ctrl+W
关闭窗口	Cmd+Shift+W	Alt+F4

终端快捷键

功能	macOS	Windows/Linux
新建终端	Ctrl+Shift+`	Ctrl+Shift+`
拆分终端	Cmd+\	Ctrl+\
切换终端	Cmd+Shift+P → Terminal	Ctrl+Shift+P → Terminal
清屏	Cmd+K	Ctrl+L

高级编辑技巧

1. 多光标编辑

使用方法：

方法 1：逐个添加
- 选中一个词
- Cmd/Ctrl + D 逐个选择下一个相同词
- 同时编辑所有选中项

方法 2：全部选择
- 选中一个词
- Cmd/Ctrl + Shift + L 选择所有相同词
- 批量修改

方法 3：手动添加
- Option/Alt + Click 在多处放置光标
- 同时编辑多个位置

方法 4：列选择
- Shift + Option/Alt + 拖动鼠标
- 创建矩形选择区域

应用场景：

javascript

// 场景 1：批量修改变量名
const oldName1 = 1;
const oldName2 = 2;
const oldName3 = 3;
// 选中 oldName → Cmd+D 三次 → 输入 newName

// 场景 2：添加分号
console.log("a")
console.log("b")
console.log("c")
// Option/Alt + Click 每行末尾 → 输入 ;

// 场景 3：批量包裹标签
item1
item2
item3
// Cmd/Ctrl + Shift + L → 输入 <li> → End → 输入 </li>

2. 代码片段（Snippets）

创建自定义代码片段：

1. Cmd/Ctrl + Shift + P
2. 输入 "Configure User Snippets"
3. 选择语言（如 javascript.json）
4. 添加代码片段

示例：React 组件模板

json

{
  "React Functional Component": {
    "prefix": "rfc",
    "body": [
      "import React from 'react';",
      "",
      "const ${1:ComponentName} = (${2:props}) => {",
      "  return (",
      "    <div>",
      "      $0",
      "    </div>",
      "  );",
      "};",
      "",
      "export default ${1:ComponentName};"
    ],
    "description": "Create a React functional component"
  }
}

使用：

输入 rfc → Tab → 输入组件名 → Tab → 完成

3. 任务自动化

创建 tasks.json：

json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "npm: build",
      "type": "npm",
      "script": "build",
      "problemMatcher": [],
      "group": {
        "kind": "build",
        "isDefault": true
      }
    },
    {
      "label": "npm: dev",
      "type": "npm",
      "script": "dev",
      "isBackground": true,
      "problemMatcher": []
    },
    {
      "label": "Run Tests",
      "type": "shell",
      "command": "npm test",
      "group": "test"
    }
  ]
}

运行任务：

Cmd/Ctrl + Shift + P → Tasks: Run Task
或使用快捷键 Cmd/Ctrl + Shift + B（构建）

4. 调试配置

创建 launch.json：

json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "skipFiles": ["<node_internals>/**"],
      "program": "${workspaceFolder}/src/index.js"
    },
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}"
    },
    {
      "type": "python",
      "request": "launch",
      "name": "Python: Current File",
      "program": "${file}",
      "console": "integratedTerminal"
    }
  ]
}

调试快捷键：

F5 - 启动调试
Shift+F5 - 停止调试
F9 - 切换断点
F10 - 单步跳过
F11 - 单步进入
Shift+F11 - 单步跳出

必备插件推荐

通用增强

插件	功能	评分
Chinese (Simplified)	中文界面	⭐⭐⭐⭐⭐
Material Icon Theme	美观的文件图标	⭐⭐⭐⭐⭐
One Dark Pro	流行主题	⭐⭐⭐⭐⭐
Bracket Pair Colorizer	彩色括号匹配	⭐⭐⭐⭐
Error Lens	错误实时显示	⭐⭐⭐⭐⭐
Todo Tree	TODO 管理	⭐⭐⭐⭐⭐

前端开发

插件	功能	评分
ESLint	JavaScript 代码检查	⭐⭐⭐⭐⭐
Prettier	代码格式化	⭐⭐⭐⭐⭐
Auto Rename Tag	自动重命名标签	⭐⭐⭐⭐⭐
Live Server	实时预览服务器	⭐⭐⭐⭐⭐
CSS Peek	CSS 定义跳转	⭐⭐⭐⭐
IntelliSense for CSS	CSS 智能提示	⭐⭐⭐⭐

后端开发

插件	功能	评分
Python	Python 支持	⭐⭐⭐⭐⭐
Go	Go 语言支持	⭐⭐⭐⭐⭐
Java Extension Pack	Java 开发套件	⭐⭐⭐⭐⭐
PHP Intelephense	PHP 智能提示	⭐⭐⭐⭐⭐
REST Client	API 测试	⭐⭐⭐⭐⭐

Git 增强

插件	功能	评分
GitLens	Git 增强工具	⭐⭐⭐⭐⭐
Git Graph	Git 可视化	⭐⭐⭐⭐⭐
Git History	Git 历史记录	⭐⭐⭐⭐

Docker & DevOps

插件	功能	评分
Docker	Docker 支持	⭐⭐⭐⭐⭐
Remote - SSH	远程开发	⭐⭐⭐⭐⭐
Remote - Containers	容器开发	⭐⭐⭐⭐⭐
Kubernetes	K8s 支持	⭐⭐⭐⭐

productivity

插件	功能	评分
Code Spell Checker	拼写检查	⭐⭐⭐⭐⭐
Path Intellisense	路径自动补全	⭐⭐⭐⭐⭐
Import Cost	显示导入包大小	⭐⭐⭐⭐
Thunder Client	轻量级 API 客户端	⭐⭐⭐⭐⭐

常见问题解答

Q1: VS Code 启动慢怎么办？

解决方案：

bash

# 1. 检查扩展加载时间
Cmd/Ctrl + Shift + P → "Show Running Extensions"

# 2. 禁用不常用的扩展
# 扩展面板 → 右键扩展 → Disable

# 3. 使用 Profile 功能
# 创建不同的 Profile 用于不同项目
# File → Preferences → Profiles

# 4. 清理缓存
# 删除以下目录后重启：
# macOS: ~/Library/Application Support/Code/
# Windows: %APPDATA%/Code/
# Linux: ~/.config/Code/

Q2: 如何同步配置到多台设备？

方法 1：Settings Sync（推荐）

1. 登录 GitHub 账户
2. Cmd/Ctrl + Shift + P → "Turn on Settings Sync"
3. 选择要同步的内容：
   ☑️ Settings
   ☑️ Keyboard Shortcuts
   ☑️ User Snippets
   ☑️ User Tasks
   ☑️ Extensions
   
4. 在其他设备登录同一账户即可自动同步

方法 2：手动备份

bash

# 备份配置目录
# macOS
cp -r ~/Library/Application\ Support/Code/User ~/Backup/vscode-config

# Windows
xcopy %APPDATA%\Code\User C:\Backup\vscode-config /E /I

# Linux
cp -r ~/.config/Code/User ~/Backup/vscode-config

# 恢复时复制回去即可

Q3: 如何自定义快捷键？

操作步骤：

1. Cmd/Ctrl + K, Cmd/Ctrl + S 打开键盘快捷方式
2. 搜索要修改的命令
3. 点击铅笔图标
4. 按下新的快捷键组合
5. 或直接编辑 keybindings.json

常用自定义快捷键示例：

json

[
  {
    "key": "cmd+enter",
    "command": "editor.action.insertLineAfter",
    "when": "editorTextFocus"
  },
  {
    "key": "ctrl+alt+l",
    "command": "editor.action.formatDocument",
    "when": "editorTextFocus"
  },
  {
    "key": "cmd+shift+d",
    "command": "workbench.view.debug",
    "when": "viewContainer.workbench.view.debug.enabled"
  }
]

Q4: 如何提高大型项目性能？

优化建议：

json

{
  // 排除不必要的文件
  "files.watcherExclude": {
    "**/node_modules/**": true,
    "**/.git/objects/**": true,
    "**/dist/**": true,
    "**/build/**": true
  },
  
  // 限制搜索范围
  "search.followSymlinks": false,
  "search.useIgnoreFiles": true,
  
  // 减少 IntelliSense 负担
  "typescript.disableAutomaticTypeAcquisition": true,
  
  // 禁用不必要的功能
  "editor.minimap.enabled": false,
  "editor.renderWhitespace": "none"
}

Q5: 如何使用 Remote Development？

Remote - SSH 配置：

1. 安装 Remote - SSH 扩展
2. Cmd/Ctrl + Shift + P → "Remote-SSH: Connect to Host"
3. 输入 ssh user@hostname
4. 首次连接会安装 VS Code Server
5. 之后就像本地开发一样

Remote - Containers 配置：

1. 安装 Remote - Containers 扩展
2. 在项目根目录创建 .devcontainer 文件夹
3. 添加 devcontainer.json 配置
4. Cmd/Ctrl + Shift + P → "Reopen in Container"

总结

掌握 VS Code 的高效使用技巧：

✅ 命令行工具：快速打开文件和项目
✅ 自定义配置：打造个性化的开发环境
✅ 正则表达式：强大的查找替换能力
✅ 快捷键：大幅提升编辑效率
✅ 插件生态：扩展无限可能

关键收益：

🎯 开发效率提升 50%+
⚡ 减少重复操作，专注核心逻辑
🎨 个性化配置，舒适开发体验
🔧 强大的调试和诊断工具
🌐 跨平台无缝切换

下一步学习：

开始打造你的专属开发利器吧！🚀✨

VS Code 完全指南 | 高效开发技巧、快捷键与配置优化教程 ​

为什么选择 VS Code？ ​

核心优势 ​

适用场景 ​

命令行工具 ​

命令行工具详解 ​

安装命令行工具 ​

常用命令详解 ​

自定义设置 ​

Settings.json 完整配置指南 ​

如何打开 settings.json ​

编辑器核心配置 ​

工作台配置 ​

文件关联配置 ​

语言特定配置 ​

扩展配置 ​

推荐编程字体 ​

VSCode 查找和替换正则表达式转义字符 ​

正则表达式实战示例 ​

常用正则模式 ​

查找替换实战 ​

正则测试工具 ​

技巧 ​

必备快捷键大全 ​

通用快捷键 ​

编辑快捷键 ​

导航快捷键 ​

多光标操作 ​

窗口管理 ​

终端快捷键 ​

高级编辑技巧 ​

1. 多光标编辑 ​

2. 代码片段（Snippets） ​

3. 任务自动化 ​

4. 调试配置 ​

必备插件推荐 ​

通用增强 ​

前端开发 ​

后端开发 ​

Git 增强 ​

Docker & DevOps ​

productivity ​

常见问题解答 ​

Q1: VS Code 启动慢怎么办？ ​

Q2: 如何同步配置到多台设备？ ​

Q3: 如何自定义快捷键？ ​

Q4: 如何提高大型项目性能？ ​

Q5: 如何使用 Remote Development？ ​

总结 ​

VS Code 完全指南 | 高效开发技巧、快捷键与配置优化教程

为什么选择 VS Code？

核心优势

适用场景

命令行工具

命令行工具详解

安装命令行工具

常用命令详解

自定义设置

Settings.json 完整配置指南

如何打开 settings.json

编辑器核心配置

工作台配置

文件关联配置

语言特定配置

扩展配置

推荐编程字体

VSCode 查找和替换正则表达式转义字符

正则表达式实战示例

常用正则模式

查找替换实战

正则测试工具

技巧

必备快捷键大全

通用快捷键

编辑快捷键

导航快捷键

多光标操作

窗口管理

终端快捷键

高级编辑技巧

1. 多光标编辑

2. 代码片段（Snippets）

3. 任务自动化

4. 调试配置

必备插件推荐

通用增强

前端开发

后端开发

Git 增强

Docker & DevOps

productivity

常见问题解答

Q1: VS Code 启动慢怎么办？

Q2: 如何同步配置到多台设备？

Q3: 如何自定义快捷键？

Q4: 如何提高大型项目性能？

Q5: 如何使用 Remote Development？

总结