最全的 VS Code 使用教程

作者: 王炳明 分类: 工具库 发布时间: 2021-08-27 22:05 热度:1,415

工作区的建立

最全的 VS Code 使用教程

最全的 VS Code 使用教程

最全的 VS Code 使用教程

可以使用 peacock 插件来测试效果

快捷键

安装插件

使用 Ctrl (或者 Command)+ P,然后输入 ext install xxx 就可以安装名为 xxx 的插件了

输入命令

使用 F1 或者 ⌘ ⇧ P 就会弹出来,或者右键选择Command Palette

导航跳转

Ctrl (或者 Command)+ P 后

  • 再输入文件名,就可以直接搜索并跳转
  • 再输入 ?:就可以列出所有当前可以执行的动作
  • 再输入 @ :就可以搜索并跳转到指定symbol,查找属性或函数(更推荐的做法使用F12)
  • 再输入::就可以跳转到指定行数,也可以按住 ⌃ G
  • 再输入@::就可以根据分类跳转到指定 symbol,查找属性或函数。
  • 再输入 !:就可以显示 Errors 或 Warnings

视野移动

  • Command + Up 跳转至文件开头
  • Command + Down 跳转至文件结尾
  • Ctrl + PgUp 按行向上滚动
  • Ctrl + PgDown 按行向下滚动
  • Command + PgUp 按屏向上滚动
  • Command + PgDown 按屏向下滚动

光标移动

  • 后退:Ctrl + –
  • 前进:Ctrl + Shift + –
  • 跳转到匹配的括号:Command + Shift + \
  • F8 下一个错误或警告位置
  • Shift + F8 上一个错误或警告位置

放大或缩小字体

  • 放大字体:Command + +
  • 缩小字体:Command + –

变量的切换:Command + Shift + .

搜索

文件内搜索:⌘ F

项目内搜索:⌘ ⇧ F

搜索并跳转到某个文件:Command + P

帮助

快捷键列表:⌘ K ⌘ S

最全的 VS Code 使用教程

编辑相关

插入多个光标:Option + 点击

选中一行:⌘ L

在终端中清屏:⌘ K

删除一行:⌘ X 或者 ⌘ ⇧ K

复制行:⇧ ⌥ 向上箭头 ,⇧ ⌥ 向下箭头

向上复制行:Option + Shift + Up

向下复制行:Option + Shift + Down

下一行插入:Command + Enter

上一行插入:Command + Shift + Enter

增加缩进:Command + [ 或者 Tab

减少缩进:Command + ] 或者 Shift + Tab

添加、移除行注释:Command + /

添加、移除块注释:Option + Shift + A

自动换行、取消自动换行:Option + Z

全局搜索:Command + Shift + F

全局搜索替换:Command + Shift + H

跳转到声明位置:F12

显示所有引用:Shift + F12

显示声明内容:Option + F12

分屏查看具体声明内容:Command + K F12

函数参数提示:Command + Shift + Space

格式化:Option + Shift + F

格式化选中内容:Command + K Command + F

窗口相关

显示终端:Ctrl + ` (Esc 下面那个)

新建终端:Ctrl + Shift + `

正向切换标签页:Ctrl + Tab

反向切换标签页:Ctrl + Shift + Tab

重新打开关闭的窗口:Command + Shift + T

五个侧边栏窗口

  • 展开或收起侧边栏:Command + B
  • 显示资源管理器 或 切换焦点:Command + Shift + E
  • 显示搜索框:Command + Shift + F
  • 显示调试面板:Command + Shift + D
  • 显示插件面板:Command + Shift + X
  • 显示Git面板:Ctrl + Shift + G

底部边栏窗口:

  • 显示输出面板:Command + Shift + U

新建窗口

  • 打开系统默认新终端:Command + Shift + C
  • Markdown预览窗口:Command + Shift + V

切换窗口

  • 切换窗口:Ctrl + W

在终端中视野移动

  • Command + Up 向上滚动
  • Command + Down 向下滚动
  • PgUp 向上翻页
  • PgDown 向下翻页
  • Command + Home 滚动到顶部
  • Command + End 滚动到底部

分屏

  • 编辑器分屏:Command + \

分组:

  • 切换到或新建第一分组:Command + 1
  • 切换到或新建第二分组:Command + 2
  • 切换到或新建第三分组:Command + 3
  • 切换到或新建上一分组:Command + K Command + Left
  • 切换到或新建下一分组:Command + K Command + Right
  • 左移编辑器:Command + K Command + Shift + Left
  • 右移编辑器:Command + K Command + Shift + Right
  • 激活左侧编辑组:Command + K Left
  • 激活右侧编辑组:Command + K Right

运行调试

  • F9:设置 或 取消断点
  • F5:开始 或 继续
  • F11:下一步,有函数就进入
  • Shift + F11:跳出函数
  • F10:下一步
  • Command + K Command + I:显示悬停信息

其他

打开在线的快捷键 PDF 速查表 :Command + K + R

更多快捷键,请查看 :https://segmentfault.com/a/1190000012811886

插件推荐

Peacock

最全的 VS Code 使用教程

LiveCode

最全的 VS Code 使用教程

Autopep8

按住格式化快捷键:Option + Shift + F,就会触发格式化,如果没有安装,则会提示你安装

但是这种安装方式只是在当前 Python 环境中安装它,并不是全局的,切换个环境就不能用啦

所以建议还是到商店里去安装

最全的 VS Code 使用教程

配置 Python 运行环境

快捷键:⌘ K M,但是由于这个快捷键跟 Alfred 冲突,因此我将其改成 ⌘ ⌥ M

再往下选,就可以打开 setting.json 啦

最全的 VS Code 使用教程

最全的 VS Code 使用教程

配置 Python 解释器

最全的 VS Code 使用教程

最全的 VS Code 使用教程

最全的 VS Code 使用教程

最全的 VS Code 使用教程

运行 Python 代码

运行整个Python文件,使用快捷键:⌃ ⌥ N

运行某一行 Python 代码:⇧ ↩︎

调试 Python 代码

最全的 VS Code 使用教程

最全的 VS Code 使用教程

最全的 VS Code 使用教程

然后就会创建这么一个 json 文件,这个配置文件,记录着你启动的方法

最全的 VS Code 使用教程

有了这个文件后,以后不用每次都选一次是要调试文件还是调试项目。

有了这个文件后,左边就没有 Run and Debug 的按钮了,那如何调试呢?

使用万能键 ⌘ P 然后输入 debug 就可以了

最全的 VS Code 使用教程

如何不想敲入那么多命令也没关系,在如下两个箭头处都有运行的按钮

最全的 VS Code 使用教程

配置样式

文件树缩进

原生的 VSCode 文件树,简直反人类,好多次我想用肉眼找文件,注视着那个文件树,我直接放弃了,父子层级很难用肉眼一眼分辨,找一个文件要消耗极大的专注力。

最全的 VS Code 使用教程

究其原因,不过是 VSCode 文件树的缩进只有 8 个单位,通过设置将其设置大点会舒服很多,比如 25 是一个不错的数值。

最全的 VS Code 使用教程

是不是感觉好多了呢?

最全的 VS Code 使用教程

文章有帮助,请作者喝杯咖啡?

发表评论