21 个 VSCode 快捷键,让编码更快、更有趣
在Medium上找到我
你已经安装了一些很棒的工具或扩展来加速你的开发流程,并且玩得很开心。这很棒,但你仍有可能错过 VS Code 提供的一些快捷方式,哪怕只有一个。并不是每个人都有时间去浏览每一个快捷方式,找到那些能让他们更快、更有趣的快捷方式——因为快捷方式实在太多了!
此外,本文列出的许多要点都可以自定义绑定到键盘快捷键,因此请记住,您不必每次想要调用命令时都打开命令面板。
在这篇文章中,我将列出我最喜欢的一些快捷键,它们让我的编程速度更快。我个人认为使用这些快捷键会让编程变得更有趣。看着自己的时间缩短一半,让我感觉自己更有动力了 :)
以下是 21 个 VS Code 快捷方式,可让编码更快、更有趣:
1. 一次性在所有文件中搜索文本(Windows:Ctrl + Shift + F
,Mac Control + Shift + F
:)
我最喜欢的 VS Code 功能之一是能够在项目目录中的所有文件中搜索任何匹配的文本。最棒的是?它的速度快得惊人!
要使用此功能,您可以按 打开视图Ctrl + Shift + F
。它将在编辑器左侧显示此侧栏:
通过输入文本并按Enter 键,VS 代码将为您提供与文本匹配的结果列表,如下所示:
您还可以在一秒钟内一次性替换每个结果文件中所有匹配的文本。如果您点击左侧的小箭头,它将在下方弹出第二个输入框,您可以在其中输入要替换的文本,同时点击右侧出现的小框:
此功能可以在最紧迫的情况下为您和您的团队节省大量时间。
2. 设置标签的强调色(Material 主题 - 非独家)
你是否厌倦了每天看到相同的标签页强调色?如果你使用VS Code 的Material Theme扩展,你实际上可以为标签页选择自定义强调色,如下所示:
红色的:
紫色的:
黄色的:
有 16 种不同颜色可供选择!
因此,如果您有扩展程序,请打开命令面板(Ctrl + Shift + P),选择Material Theme:设置强调色并从列表中选择一种颜色,它将更改选项卡的下划线颜色,如下所示:

但是等一下...在该示例中我没有使用 Material Theme。
这是因为安装了 Material Theme 扩展后,该功能可在您的所有主题中使用。您无需使用Material Theme 即可使用此功能!
3. 进程浏览器
你是否觉得 VS Code 编辑器有时运行速度有点慢?有没有想过看看是什么占用了你的内存?如果你还不知道的话,VS Code 有一个 Process Explorer 功能,可以让你打开一个如下所示的窗口:
看起来很熟悉?
您可能已经在 Windows任务管理器中看到过此功能,可以在 VS 代码编辑器外部按下Ctrl + Alt + Delete 来使用它。(Mac :)Control + Option + Delete
4. 扩展括号选择
打开键盘快捷键并搜索“扩展括号选择”
这是我花了一段时间才发现的功能之一,因为我根本猜不出这个功能的名称。
当我第一次在 YouTube 视频上看到有人使用它时,我就知道我必须尽一切努力找到它,以便我可以设置键盘快捷键并在我的项目中使用它。
使用此功能将允许您自动选择从开始花括号到结束的整个块:

我发现这些在您想要交换 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. 运行扩展
您可以通过打开命令面板并输入“显示正在运行的扩展”来查看所有正在运行的扩展。
您可能已经猜到了,这将向您显示正在运行的扩展列表。
……但这还不是全部。你还会获得一些信息,了解哪些扩展程序在激活时比其他扩展程序花费的时间更长。如果你曾经好奇为什么你的编辑器加载速度比平时慢,那么答案可能就在这个窗口中:
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

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

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

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

13. 启动性能
有时,当您试图找出出现性能问题的原因时,如果缺乏有关性能问题的进一步详细信息,这可能会带来麻烦。
有时,如果你足够幸运,你会找到一个能帮你解答所有问题的工具。在 VS Code 中,启动性能是重中之重。正因如此,你才能奇迹般地弹出一个有用的窗口,其中包含你所需的所有信息:
因此,继续打开命令面板并搜索启动性能!
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
):

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

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
),以便它们对我来说更直观:

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

按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