标签 vscode配置 下的文章

VSCode 工作台介绍,我们把 VS Code 的整个界面统称为工作台(Workbench),它就像是木匠的工作桌,上面摆放着做木工活时需要的各式工具。一个好的匠人一定会精心摆置自己的工作台,把最需要的、频繁使用的工具放在最顺手的地方,并充分利用桌子的空间,但又不喧宾夺主。编程也是一样,除了使用核心的编辑器,我们也经常需要快速访问文件目录,使用终端运行一些脚本或者使用版本管理工具等等,因此我们就需要了解 VS Code 的工作台上都有哪些工具,它们是干什么的,以及工作时需要使用哪些才有可能事半功倍。所以,从今天开始,我将和你一起探索 VS Code 工作区里的各个组件。首先,你打开欢迎界面,并且点击界面右侧的“界面概览”。

- 阅读剩余部分 -

VSCode 工作区切换,如果你同时打开了多个窗口,可以按下 Ctrl + W,或者调出命令面板,搜索 “切换窗口(Switch Window)”,然后选择你要跳转的那个文件夹中去。切换窗口如果你只是要跳转到上一个打开的窗口,那就更方便了。打开命令面板,搜索“快速切换窗口(Quick Switch Window)”并执行,就能够直接跳转到之前的窗口了,而无需再做选择。这里我倒是非常建议你给这个命令指定一个快捷键,这样你就能在窗口之间一键切换了。

- 阅读剩余部分 -

VSCode多文件搜索和替换,虽然在“基础入门”这个部分中,我们一直都在介绍编辑器的各种功能,但是,为了把搜索这样的一个功能介绍完整,我们今天就再讲一下在 VS Code 当中如何使用多文件搜索。多文件搜索的运行方法跟单文件搜索非常类似。单文件搜索,我们是通过按下“Cmd+ F” 来调出搜索窗口的,而多文件搜索则是通过按下 “Cmd + Shift + F” (Windows 上是 Ctrl + Shift + F)来调出多文件搜索的视图。

- 阅读剩余部分 -

VS Code 多文件夹工作区,多文件夹工作区(multi-root workspace)。老实说呢,这个概念是有一定的理解难度的。上面我们提到的基于文件夹的这种项目管理方式,从 VS Code 第一天开始就存在了。也几乎从第一天开始,我们就收到了用户对于这一个设计不满的反馈。对于这些不满的用户而言,他们的痛点在于他们经常需要同时对多个文件夹下的代码进行操作。但是 VS Code 关于单个文件夹的这种操作模式,要求了他们必须同时打开多个窗口,并不停地在它们之间切换。多文件夹工作区就是为了针对这个问题而实现的解决方案。那下面我们就一起来看一看怎样去创建一个多文件夹工作区。

- 阅读剩余部分 -

VSCode单文件搜索,今天我们重新回到原点,来看一下如何使用编辑器自带的文本搜索功能,快速地穿梭于海量的代码之中。在我看来,一个功能丰富且快速的搜索,在很多情况下甚至会比语言服务还要来得有用。我们把光标放在编辑器当中,然后按下 “Cmd + F” (Windows 上是 Ctrl + F),就能够快速地调出搜索窗口(可能这个命令你早就发现了或者经常使用了)。当我们调出搜索窗口的时候,编辑器就会把当前光标所在位置的单词自动填充到搜索框中。与此同时,当前文件里和搜索关键词相同的单词都会被高亮出来。自动填充搜索关键词的好处在于,当我们按下 “Cmd +F” 搜索这个单词之后,我们还能够立刻通过回车键或者 “shift+回车键” 在所有搜索结果当中快速跳转。

- 阅读剩余部分 -

VSCode 代码调试器,和语言功能一样,VS Code 是把调试功能的最终实现交给插件来完成的。VS Code 提供了一套通用的图形界面和交互方式,比如怎么创建断点、如何添加条件断点、如何查看当前调试状态下参数的值,等等。无论你使用哪个编程语言或者调试器,这一套交互流程都是相似的。而对于插件作者而言,他们需要完成的是如何把真正的调试工作跟 VS Code 的界面和交互结合起来,为此 VS Code 为插件作者提供了一套统一的接口,叫做Debug Adapter Protocol(DAP)。当用户在界面上完成一系列调试相关的操作时,VS Code 则通过 DAP 唤起调试插件,由插件完成最终的操作。

- 阅读剩余部分 -

VSCode 创建终端,VS Code 在设计之初,就一直在思考如何让 VS Code 和终端能够更紧密联系在一起。其第一种方式就是从终端中以命令行的形式打开 VS Code。第二种方式,就是允许用户从资源管理器里调出系统终端。首先,我们要做的第一件事情就是,打开和创建一个集成终端。最简单的方式就是按一下 Ctrl + ` 键,一个新的终端就被创建出来了。在这个终端被创建出来后,我们还可以通过再次按下 Ctrl + ` 键将其隐藏。如果查看一下快捷键绑定,或者使用命令面板的话,我们会发现这个命令其实是 “切换集成终端”(Toggle Integrated Terminal)。它的作用是:如果还没有任何集成终端存在,那么它将创建一个新的,然后显示出来;如果已经有几个集成终端了,那么就把终端面板调出来;而如果我们的光标就在集成终端里,那么这个命令会将终端面板隐藏。

- 阅读剩余部分 -

VSCode 编辑器网格布局,VS Code 对编辑器的布局,已经逐渐变得越来越宽松了。特别是最近的几个版本里已经支持了网格布局,也就是说,编辑器组不再拘泥于横向或者纵向布局了。这里,你可以先试着运行命令 “2 x 2 网格编辑器布局”[Grid Editor Layout(2 x 2)]。一旦变成了网格布局,毋庸置疑,VS Code 肯定会添加命令让我们能跳转到当前编辑器上方、下方、左侧和右侧的“编辑器”。比如在下图中,我就使用了 “聚焦到上方编辑器组”(Focus Above Editor Group),然后鼠标就移动到了最上面的那个编辑器,其他的几个命令也是类似的。

- 阅读剩余部分 -

VSCode 编辑器拖拽 Drag & Drop,随着布局的逐渐灵活,可以使用的命令也越来越多了,从最基础的聚焦下一个编辑器组和移动编辑器,到更灵活地在网格布局里聚焦编辑器,要想都记住它们并且绑定合适的快捷键,真的是太难了。对此我有两个建议。第一,虽然网格系统很强大,但是不意味着它一定就是高效的或者说适合自己的。就我自己而言,我通常只会使用左、右两个编辑器组,并且只需要熟悉几个快捷键就行了。第二,就是使用鼠标。VS Code 有很不错的拖拽功能。比如你可以在编辑器组中对 Tab 进行拖拽,把它放到你想要的位置。

- 阅读剩余部分 -

VSCode 编辑器 – Tab,呼声非常高的编辑器相关的需求就是 Tab 的支持了。VS Code 虽然一直以来技术上是支持 Tab 的,但是并不会显示出来,而是要求你按下Cmd + P(Windows 上是 Ctrl + P)打开命令面板来进行文件的切换。但是 Tab 的呼声真的非常高,于是很快 VS Code 就把这个功能加上了。所以,我想对于 Tab ,就并不需要过多的介绍了。不过,还是不得不提以下几个跟 Tab 相关的快捷键。比如,在 Tab 之间进行跳转。你可以使用命令 “打开上/下一个编辑器”(Open Previous/Next Editor)或者按下 Cmd + Option + 左/右方向键(Windows 上是 Ctrl + Pagedown/Pageup)在编辑器 Tab 之间进行跳转。

- 阅读剩余部分 -