Skip to content

VS Code 常用技巧速查

持续更新Windows/Linux适配 macOS

🎯 学习目标

收录实用但容易遗忘的 VS Code 编辑技巧和快捷键,帮助提高日常编码效率。macOS 用户请将 Ctrl 替换为 CmdAlt 替换为 Option


📝 文本编辑技巧

⚡ 自动换行

快捷键: Alt + Z

快速切换编辑器的自动换行功能,对于查看长行代码特别有用。

💡 适用场景

查看长 SQL 语句、JSON 数据、日志文件时特别方便。

🔄 重命名所有匹配项

快捷键: Ctrl + Shift + L

使用场景: 需要同时修改文件中所有同名变量或函数。

操作步骤:

  1. 选中要重命名的变量或函数名
  2. 按下快捷键
  3. 所有匹配项会被同时选中
  4. 直接输入新名称,所有实例会同步修改

💡 最佳实践

这是重构代码时最常用的功能之一,特别适合在单文件内批量重命名。

➕ 添加下一个匹配项

快捷键: Ctrl + D

使用场景: 需要选择性地批量修改部分匹配项。

操作步骤:

  1. 选中第一个要修改的实例
  2. Ctrl + D 选中下一个匹配项
  3. 继续按快捷键逐个添加更多匹配项
  4. 开始编辑,所有选中的实例会同步修改

⚠️ 对比说明

Ctrl + Shift + L 不同,此功能允许您选择性地添加匹配项,而不是全选。


📦 列(方框)选择

快捷键: Shift + Alt + 鼠标拖动

使用场景: 需要对多行的相同列位置进行编辑。

示例应用:

  • 在多行代码前添加相同的前缀
  • 删除多行的相同列位置内容
  • 批量修改对齐的代码块
javascript
// 示例:批量添加注释
function getData() {}    →    // function getData() {}
function setData() {}    →    // function setData() {}
function saveData() {}   →    // function saveData() {}
🔍 扩大/收缩选区

快捷键:

  • 扩大选区: Shift + Alt + →
  • 收缩选区: Shift + Alt + ←

使用场景: 智能选择代码块,按语法结构逐层扩大或缩小选区。

📎 查看示例
javascript
// 光标在 "name" 处,按 Shift + Alt + → 依次选中:
const user = { name: "John" };
//             ^^^^  →  "name"
//             ^^^^^^^  →  name: "John"
//             ^^^^^^^^^^^^^^^^  →  { name: "John" }
//             ^^^^^^^^^^^^^^^^^^^^^^^^^^  →  整行
🧹 删除尾随空格

快捷键: Ctrl + KCtrl + X

使用场景: 清理文件中所有行尾的多余空格。

操作步骤:

  1. 先按 Ctrl + K(不要松开)
  2. 再按 Ctrl + X
  3. 所有行尾空格被删除

💡 自动化配置

可以在设置中启用 "files.trimTrailingWhitespace": true,保存文件时自动删除。


🔍 导航与搜索

🚀 跳转到文件

快捷键: Ctrl + P

使用场景: 快速在项目中查找并打开文件。

高级用法:

  • 输入文件名的任意部分进行模糊搜索
  • 支持驼峰命名匹配(如输入 UC 可以找到 UserController.js
  • 在路径中包含目录名以缩小搜索范围
📎 查看示例
bash
输入 "user"  UserService.js, UserModel.js, user.css
输入 "api/user"  api/UserController.js
输入 "UC"  UserController.js
🎯 跳转到指定行

快捷键: Ctrl + G

使用场景: 快速跳转到文件中的指定行号。

操作步骤:

  1. Ctrl + G
  2. 输入行号(如 150
  3. 按 Enter 跳转

💡 组合使用技巧

可以在 Ctrl + P 后输入 :行号 直接跳转,如 :150


🎨 Markdown 编辑技巧

📸 拖放插入图片或文件

快捷键: Shift + 拖放

使用场景: 快速在 Markdown 中插入图片或文件链接。

操作步骤:

  1. 从资源管理器中选择图片或文件
  2. 按住 Shift
  3. 拖放到 Markdown 编辑器中
  4. 自动生成符合语法的链接或图片标记
📎 生成格式示例
markdown
<!-- 图片 -->
![图片描述](./images/screenshot.png)

<!-- 文件链接 -->
[文件名称](./docs/document.pdf)
📝 Markdown 语法快速参考

链接与图片:

markdown
<!-- 链接 -->
[链接文本](URL)
[百度](https://www.baidu.com)

<!-- 图片 -->
![图片替代文本](图片路径)
![Logo](./logo.png)

📌 VitePress 特性

VitePress 支持使用 <Badge> 组件、自定义容器等增强语法。

✨ 使用代码片段

快捷键方式一: Ctrl + Shift + P → 选择「插入代码片段」

快捷键方式二: 输入关键字 → 按 Ctrl + Space → 选择片段

📎 Markdown 常用片段
  • 输入 code → 生成代码块
  • 输入 h1-h6 → 生成标题
  • 输入 image → 生成图片语法
  • 输入 link → 生成链接语法
  • 输入 table → 生成表格模板

⚡ 快捷键速查表

使用说明

以下快捷键基于 Windows/Linux 系统,macOS 用户请将 Ctrl 替换为 CmdAlt 替换为 Option

功能快捷键说明分类
自动换行Alt + Z切换自动换行📝 编辑
重命名所有匹配项Ctrl + Shift + L全选并编辑所有匹配📝 编辑
添加下一个匹配项Ctrl + D逐个选中匹配项📝 编辑
跳转到文件Ctrl + P快速打开文件🔍 导航
跳转到行Ctrl + G跳转到指定行号🔍 导航
列选择Shift + Alt + 拖动矩形选择📝 编辑
扩大选区Shift + Alt + →智能扩大选区📝 编辑
收缩选区Shift + Alt + ←智能收缩选区📝 编辑
删除尾随空格Ctrl + KCtrl + X清理行尾空格🧹 清理
代码片段Ctrl + Space触发智能提示✨ 辅助

💡 实践建议

📚 学习策略
  1. 每周掌握 2-3 个技巧 — 不要试图一次性记住所有快捷键
  2. 在实际项目中应用 — 只有实践才能转化为肌肉记忆
  3. 创建速查卡片 — 将常用快捷键打印或制作成桌面壁纸

💡 记忆技巧

按照使用频率排序,先掌握最常用的快捷键。

⚙️ 自定义快捷键

如果某些快捷键不符合您的习惯,可以自定义:

  1. Ctrl + KCtrl + S 打开键盘快捷方式设置
  2. 搜索要修改的命令
  3. 双击并设置新的快捷键组合

⚠️ 注意事项

避免与系统快捷键冲突。


🔗 相关资源

📎 官方文档
📎 推荐扩展

📌 持续更新

本文档会根据日常使用经验持续更新,欢迎补充更多实用技巧!

最后更新: 2025-11-25 | 作者: Hugo | v2.0