『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

之前写过三篇文章,收获了极其不错的阅读量与转发量:

一方面,我确实将 VS Code 作为自己的主力编辑器:远程操作时用、写笔记时用、写代码(C++/Python/JavaScript)时也用,我已经具有了些许心得与经验;另一方面,自己也很喜欢积累或阅读相关资料(比如韩骏老师的《Visual Studio Code 权威指南》),并且在实践与学习中做成笔记(比如录制gif)。

本文将汇总我录制的 34 张 gif 动图,为读者朋友推荐并整理『远离鼠标,提升效率』的 VS Code 快捷操作。

本文大纲:

  • 6 个 Ctrl+Shift+Alt 组合
  • 8 个你可能不知道的重要操作
  • 3 个有趣又通用的小众插件
  • 5+ 的 vim + vscode 操作

6 个 Ctrl+Shift+Alt 组合

Ctrl

Ctrl 控制屏幕的移动与光标的移动。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Ctrl 加上左右键,以单词为单位跳转。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Ctrl 加上上下键,小幅度滚动屏幕(滚动一行)。

Shift

Shift 相当于「拖动鼠标」,与方向键结合选中文本。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

有了 Shift ,不再用鼠标拖动。

Alt

Alt 较为特殊。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Alt 与上下键结合,英文叫做「copy line」,相当于拖着这一行上下移动。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Alt 与左右键结合,实现「跳转」。比如我们去看某个函数的定义,我们跳转过去,当我们看完了,想要跳转回来时,不需要再动脑回找,直接使用 Alt + ← 即可(Alt + backspace同)。

Ctrl + Shift

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Ctrl + Shift + 上下左右 较好理解,相当于 Ctrl 与 Shift 相结合, Shift 起选中的作用, Ctrl 则让方向键的步长更长(以单词为单位)。

Ctrl + Alt

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Ctrl + Alt + 上下多光标 。注意使用 Escape 退出多光标模式。

Shift + Alt

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

Shift + Alt + 上下,复制这一行。

8 个你可能不知道的重要操作

F12 跳转引用

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图:

  • F12 跳转到变量、函数、类的定义处
  • Shift + F12 跳转到其引用处;多个引用时,可以选择具体哪个 reference

使用 F12 也可以跳转到环境库的源码中,如下图,我跳转到了库 gym (使用 conda 安装到 lib)的 core.py

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

查找与替换

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

使用 Ctrl + F 可以进行查找;使用 Ctrl + H 则弹出替换窗口。如上,我将 foo 替换为 foobar ,使用 Alt + R 支持正则语法。

Ctrl + Shift + P

Ctrl + Shift + P 恐怕是各个编辑器、调试器中最常用的操作了:弹出命令窗口,然后我们输入相关命令的名称,回车则执行该命令。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,我使用 Ctrl + Shift + P ,执行 View: Split Editor Right 命令,接着,使用 Ctrl + P 调用出窗口切换器(文件切换器)。

切换窗口

处于一堆、相互重叠的文件, VS code 称其为一个「group」。我们通常要用到「group的组内切换」和「group间切换」。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,Ctrl + <你要去的 group 编号> 来把光标(的注意力 focus)集中到你要去的 group 上。上面 Ctrl + 1 切换到左边的 group ;Ctrl + 2 切换到右边的 group 。

Alt + <数字> 则是在 group 内切换标签页。

此外,注意到 Ctrl + Shift + E 打开或关闭文件管理器 Explorer ,就是左侧的那个树状图。而 Ctrl + B 是开关 Side Bar ,即侧边栏。

新建、关闭与调试台

使用 Ctrl + ~ 开关终端,而 Ctrl + J 则是开关 Panel ,即含有终端、调试器的底部容器。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

此外,Ctrl + N 是新建文件,Ctrl + W 是关闭当前文件(这在所有 windows 应用上几乎都适用)。

禅模式

有时候,节目显得过于复杂臃肿,分散了我们的注意力,视野不清爽,也会降低舒适度。使用禅模式 Zen Mode 则会屏蔽这些干扰。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

可以使用 Ctrl + Shift + P 输入 Zen 来调用相关命令。此外,我将其快捷键改为了(在左下角的小齿轮的 Keymaps 中更改) Ctrl + Alt + Z ,如上图,甚是舒爽。

group size

一块小小的显示器,还要被两个或以上的 group 平分区域,我们的代码阅读屏幕实在是太『窄』了。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,我们可以用 Toggle Editor Group Sizes 来切换阅读模式,让其更宽一些。我设置了其快捷键为 Ctrl + Alt + G

Ctrl + i / Ctrl + /

如下图,使用 Ctrl + i 可以调用代码提示,而 Ctrl + / 可以将选中的文本注释掉,或者取消注释。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

3 个有趣又通用的小众插件

插件:vscode-input-sequence

一个 vscode-input-sequence 解决了我们输入序列数据的烦恼。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,配合多光标,我们可以输入一个序列的数据,并且可以决定序列的递进规则、递进步长、占位、进制等。

插件:Relative Path

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

我很喜欢 Relative Path ,如下图,输入 Ctrl + Shift + H 便自动补全文件的相对路径。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

插件:Auto Markdown TOC

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

有很多关于 markdown 自动生成目录的插件,我觉得对中文最友善的,应该是 Hunter Tran 的 Auto Markdown TOC 了。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,使用 Auto Markdown TOC 自动生成目录(同样地,在Ctrl + Shift + P 中调用相关命令)。

5+ 的 vim + vscode 操作

Vim 插件安装

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,下载 Vim 插件。这里需要注意,强烈推荐 不使用Vim自带的组合快捷键 Ctrl ,因为其会覆盖掉 VS Code 本身的快捷键以及其他插件的快捷键

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图,可以在 Settings 中搜索 useCtrlKeys 配置,并取消勾选。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

值得注意的是,我们依然可以使用 Ctrl + uCtrl + d 实现上下滚动页面,滚动行数默认为半页大小。

Vim 基础

这里要介绍的是 Vim 基础中的基础,但还是没有 Vim 基础的初学者也可以去 B 站搜索 Vim 相关的教程再巩固一下(我之后也可能录视频)。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上图:

  • Vim 中默认是 normal 模式,此时敲击字母是在敲击命令,而非编辑文本;输入 i 进入 insert 模式,此时敲击字母才是输入字母
  • insert 模式下,退出键 Escape 回到 normal 模式
  • normal 模式下,hjkl分别是左下上右

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,Shift + a(以后记作A)移到行末,并转为 insert 模式;I是行前
  • normal 模式下,o是下插一行,并跳转

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,w是向前移动一个单词,b则是向后移动一个单词

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,d是开启剪切模式,因此,dw则是剪切一个单词;dd是剪切一行
  • normal 模式下,y则是复制,而p是粘贴

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,s是删除当前光标所指并转为 insert 模式,x是删除并且不转换

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,15gg是跳转到15

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上:

  • normal 模式下,是开启选中 visual 模式

VS Code 中常用 Vim 组合逻辑

Vim 爱好者常说:Vim是一种逻辑,而非死记硬背快捷键(我还算不上 Vim 爱好者,这句话不是我说的,是 Linux 社区的一些朋友们说的)。

我对于 Vim 『逻辑』的理解,大概如下:

  • 大小写是一种相反的逻辑
  • VS Code 中一些 Ctrl 与滚动
  • i(意味着在括号里

展开的解释如下文。

大小写是一种相反的逻辑

int foo_xyz = 1;
       ^

我们知道,当光标在_处时,想要删除 _xyz ,那么就要首先 找到最近的z的位置,然后删除这个区间内的东西。 在 vim 中,则是输入 dfz 来表达, fz 则是 找到 z 的意思

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

那么,向前查找是什么呢?答案是大写的 F ,具体例子如上图。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,用 o 可以很轻松地向下插入一行,而用 O 则是向上插入一行。

VS Code 中一些 Ctrl 与滚动

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,使用 Shift + [] 是以「代码块」为单位跳行。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,Ctrl + [] 实现缩进的调整。这里结合了 visual 模式。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,[[ 跳到文件首行,而 ]] 则是行末。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,H 是到屏幕的顶部,L 是屏幕的底部,M 是屏幕的中央;而 zz 是『将光标放到屏幕中央,且不移动光标的位置(滚动屏幕)』,zt 是将光标放到顶部,zb 是底部。

i( 意味着在括号里

print("delete me")

如上,当我们想清空 print() 函数括号内的东西,我们「有逻辑地」告诉 vim 即可。把光标移到括号内,输入 ci(ci),其中 i( 是『在括号内』。

『力荐汇总』这些 VS Code 快捷键太好用,忍不住录了这34张gif动图

如上,不仅是 c 操作,也不仅仅是 () ,对于 ""[] 等都适用。

此外,还有很多逻辑可以组合,比如:j是向下跳转一行,那么 10j 就是向下10行。 此外,/ 查找功能在 vs code 中同样适用。但是,我更喜欢 vs code 自带的 ctrl + f 查找。

你好,我是小拍,985大学管理科学与工程专业在读研究生、技术爱好者与自学者,同时也是 『持续改善 · よい品よい考”』 思想的支持者和践行者。转载&合作&学习事宜,欢迎加我微信 PiperLHJ 交流。

发表评论

相关文章