21 个 VSCode 快捷键,让编码更快、更有趣

2025-05-25

21 个 VSCode 快捷键,让编码更快、更有趣

在Medium上找到我

你已经安装了一些很棒的工具或扩展来加速你的开发流程,并且玩得很开心。这很棒,但你仍有可能错过 VS Code 提供的一些快捷方式,哪怕只有一个。并不是每个人都有时间去浏览每一个快捷方式,找到那些能让他们更快、更有趣的快捷方式——因为快捷方式实在太多了

此外,本文列出的许多要点都可以自定义绑定到键盘快捷键,因此请记住,您不必每次想要调用命令时都打开命令面板。

在这篇文章中,我将列出我最喜欢的一些快捷键,它们让我的编程速度更快。我个人认为使用这些快捷键会让编程变得更有趣。看着自己的时间缩短一半,让我感觉自己更有动力了 :)

以下是 21 个 VS Code 快捷方式,可让编码更快、更有趣:

1. 一次性在所有文件中搜索文本(Windows:Ctrl + Shift + F,Mac Control + Shift + F:)

我最喜欢的 VS Code 功能之一是能够在项目目录中的所有文件中搜索任何匹配的文本。最棒的是?它的速度快得惊人!

要使用此功能,您可以按 打开视图Ctrl + Shift + F。它将在编辑器左侧显示此侧栏:

显示搜索-1

通过输入文本并按Enter 键,VS 代码将为您提供与文本匹配的结果列表,如下所示:

显示搜索-2

您还可以在一秒钟内一次性替换每个结果文件中所有匹配的文本。如果您点击左侧的小箭头,它将在下方弹出第二个输入框,您可以在其中输入要替换的文本,同时点击右侧出现的小框:

显示搜索-3

此功能可以在最紧迫的情况下为您和您的团队节省大量时间。

2. 设置标签的强调色(Material 主题 - 非独家)

你是否厌倦了每天看到相同的标签页强调色?如果你使用VS Code 的Material Theme扩展,你实际上可以为标签页选择自定义强调色,如下所示:

红色的:

强调色1

紫色的:

强调色2

黄色的:

vscode 中的强调色

有 16 种不同颜色可供选择!

因此,如果您有扩展程序,请打开命令面板(Ctrl + Shift + P),选择Material Theme:设置强调色并从列表中选择一种颜色,它将更改选项卡的下划线颜色,如下所示:

vscode 4 中的强调色

但是等一下...在该示例中我没有使用 Material Theme。

这是因为安装了 Material Theme 扩展后,该功能可在您的所有主题中使用。您无需使用Material Theme 即可使用此功能!

3. 进程浏览器

你是否觉得 VS Code 编辑器有时运行速度有点慢?有没有想过看看是什么占用了你的内存?如果你还不知道的话,VS Code 有一个 Process Explorer 功能,可以让你打开一个如下所示的窗口:

进程探索器1

看起来很熟悉?

您可能已经在 Windows任务管理器中看到过此功能,可以在 VS 代码编辑器外部按下Ctrl + Alt + Delete 来使用它。(Mac :)Control + Option + Delete

4. 扩展括号选择

打开键盘快捷键并搜索“扩展括号选择”

这是我花了一段时间才发现的功能之一,因为我根本猜不出这个功能的名称。

当我第一次在 YouTube 视频上看到有人使用它时,我就知道我必须尽一切努力找到它,以便我可以设置键盘快捷键并在我的项目中使用它。

使用此功能将允许您自动选择从开始花括号到结束的整个块:

扩展 vs 代码的括号选择

我发现这些在您想要交换 if/else 块的情况下非常有用。

5. 重新打开已关闭的编辑器

当您在处理一个大型项目时,文件散落在各处,如果您不小心关闭了一个选项卡,然后不得不在侧面菜单中再次搜索它,这可能会有点令人沮丧,因为 VS 代码有自动扩展目录的习惯。

嗯,实际上,您只需按 即可重新打开已关闭的编辑器Ctrl + Shift + T。(Mac:)Control + Shift + T您甚至可以打开之前的选项卡,甚至更之前的选项卡,等等。这是选项卡独有的撤消功能。

6. 通过匹配文本打开文件

说到文件搜索,您可以即时搜索并打开文件。这是我最喜欢的功能之一,因为您无需手动点击目录来重新打开不再打开的文件。您不会相信这每天为我节省了多少时间。

为了使用此功能,我已将键盘快捷键绑定到Ctrl + T(Mac: Control + T)。按下该快捷键时,可能会弹出“在文件中转到符号”窗口。我很少使用这个功能,所以已将其禁用。

如果要将其绑定到热键,请打开键盘快捷键(文件 > 首选项 > 键盘快捷键)并搜索workbence.action.quickOpen。双击它并分配Ctrl + T给它。

7. 集成终端

您可以打开 VS Code 的集成终端,只需按Ctrl +`(反引号)即可像普通 CLI 一样使用它。无需离开 VS Code 编辑器,是不是感觉很棒?

8. 运行扩展

您可以通过打开命令面板并输入“显示正在运行的扩展”来查看所有正在运行的扩展。

您可能已经猜到了,这将向您显示正在运行的扩展列表。

……但这还不是全部。你还会获得一些信息,了解哪些扩展程序在激活时比其他扩展程序花费的时间更长。如果你曾经好奇为什么你的编辑器加载速度比平时慢,那么答案可能就在这个窗口中:

在 vs code 中显示正在运行的扩展

9. 重新加载

我个人认为这是 VS 代码最酷的功能之一,因为它允许您在重新加载编辑器时将窗口保留在您面前,同时具有与关闭并重新打开它相同的效果。

Ctrl + Alt + R。 (Mac:Control + Option + R

10. 将标签页交换到不同的组

我在开发时经常会把某个选项卡放在错误的选项卡组中。我还尽量避免使用鼠标来操作,因为这需要我把手从键盘上移开。我的手很重,所以我想一直把手放在键盘上。幸运的是,VS Code 提供了一种将选项卡移动到单独选项卡组的方法:按Ctrl + Alt + Right Arrow(Mac: Control + Option + Right Arrow) 将选项卡移动到右侧的组,或按Ctrl + Alt + Left Arrow(Mac: Control + Option + Left Arrow) 将选项卡移动到左侧的组:

将标签转移到单独的组

11. 选择左侧/右侧的所有内容

有时您想删除光标左右两侧的所有内容。如果您还不知道可以选择光标左右两侧的所有内容,那么这将提高代码编写的效率,因为它可以加快速度

例如,要选择右侧或左侧的所有内容:

Windows:Ctrl + Shift + Home/End
Mac:Ctrl + Shift + Home/End

在 vscode1 中全选左侧或右侧

要选择右侧或左侧的几乎所有内容(将时间缩短一半):

在 vscode2 中全选左侧或右侧

12.删除前一个单词

要删除上一个单词,您可以按Ctrl + Backspace(Mac:Control + Delete)。如果您打错了字,又不想按住退格键才能找到要删除的部分,这个功能就非常有用:

在 vscode1 中删除前一个单词

实际上,您几乎可以在 VS Code 之外的任何地方使用它

在 vscode2 中删除前一个单词

13. 启动性能

有时,当您试图找出出现性能问题的原因时,如果缺乏有关性能问题的进一步详细信息,这可能会带来麻烦。

有时,如果你足够幸运,你会找到一个能帮你解答所有问题的工具。在 VS Code 中,启动性能是重中之重。正因如此,你才能奇迹般地弹出一个有用的窗口,其中包含你所需的所有信息:

启动性能1

因此,继续打开命令面板并搜索启动性能

14. 选择文字

Ctrl + Shift + Right Arrow您可以使用快捷方式(Mac: Control + Shift + Right Arrow) 和Ctrl + Shift + Left Arrow(Mac: Control + Shift + Left Arrow)逐字选择文本。

对于更快地选择单词非常有用:

用文字选择

15. 重复行

一个非常强大且众所周知的功能是复制行。只需按下Ctrl + Shift + D(Mac: Control + Shift + D):

在 vscode 中向穷人捐款

16. 移至文件开头/结尾

将光标移动到文件第一行或最后一行的最快方法是按Ctrl + Home(Mac:)Control + Home转到开头,按Ctrl + End(Mac Control + End:)转到结尾。

在 vs 代码中移动到文件的开头或结尾

17. 替换当前文件中所有匹配的文本

以前我刚开始写代码的时候,必须用鼠标手动选择匹配的事件。现在很高兴这种日子一去不复返了,因为 VS Code 提供了“更改所有事件”功能。

您可以选择任意一组文本作为选区,如果该选区出现多个文本,您可以按下Ctrl + F2(Mac: Control + F2) 一次性选中并修改所有文本。我个人觉得Alt + F3(Mac: Option + F3) 操作起来更轻松一些。

18. 向上/向下移动行

每 10 分钟上下移动一条线确实很有用。

Alt + Up Arrow(Mac: Option + Up Arrow) 向上移动,按Alt + Down Arrow(Mac: Option + Down Arrow) 向下移动。

19. 删除一行

您可以通过两种方式立即删除一行:

使用以下方式覆盖剪贴板Ctrl + X(Mac:)Control + X

删除一行并覆盖剪贴板

Ctrl + Shift + K使用(Mac: )保存剪贴板Control + Shift + K。我个人更喜欢Ctrl + Alt + D(Mac: Control + Option + D):

删除一行并覆盖剪贴板

20. 向左或向右移动编辑器

如果您像我一样,您可能会有一种无法控制的愿望,想要重新排序组中的选项卡,其中选项卡彼此相关,左侧的选项卡是高级文件,而右侧的文件是较低级别

你可以使用命令Move Editor Left和更轻松地控制它Move Editor Right。我将它们分配给Ctrl + Num Pad 4(Mac: Control + Num Pad 4) 和Ctrl + Num Pad 6(Mac: Control + Num Pad 6),以便它们对我来说更直观:

在 vscode 中将编辑器向左或向右移动

21. 在上方/下方添加光标

复制游标可以说是 VS Code 中最省时的功能了。在 TypeScript 等情况下,这个功能非常有用:

vs 代码中的光标位于上方或下方

Ctrl + Alt + Up Arrow(Mac: Control + Option + Up Arrow) 在上方添加光标或按Ctrl + Alt + Down Arrow(Mac: Control + Option + Down Arrow) 在下方添加光标。

结论

这篇文章到此结束!希望你找到了新的快捷方式!敬请期待我以后的帖子!

在Medium上找到我

文章来源:https://dev.to/jsmanifest/21-vscode-shortcuts-to-make-coding-faster-and-more-fun-3b4m
PREV
2019 年 JavaScript 开发人员的 26 个神奇 VS Code 工具
NEXT
在 React 应用中编写更简洁代码的 14 个实用技巧