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 之间进行跳转。

- 阅读剩余部分 -

VSCode 版本管理，会介绍如何在VSCode中进行查看代码变化、改变文件状态和代码提交。首先，在工作台的左侧活动栏上，我们能看到一个版本管理的图标，位于下图的第三个。查看未提交的改动如果在当前的文件夹下有尚未被提交的改动，我们能够在这个图标上面看到一个数字。数字代表了有多少个文件被修改了，只是虽改动但还未被提交。

- 阅读剩余部分 -

VSCode折叠代码快捷键，我们再来一起看一下有哪些折叠和展开代码的快捷键。首先是折叠和展开代码的两个快捷键。VSCode折叠代码的基本使用，请参考VSCode折叠代码。当我们按下 “Cmd + Option + 左方括号”（Windows 上是 Ctrl + Shift + 左方括号），当前光标所处的最内层的、可以被折叠的代码就会被折叠起来。请注意，我们在这里加了两个限制条件，“最内层”和“可以被折叠”。我们可以先用下面一个小例子来理解这两个条件。

- 阅读剩余部分 -

VSCode折叠代码，很多编程语言都使用花括号来包裹代码块。比如说类的定义、函数的定义、条件判断语句或者循环语句，它们都是用花括号作为一个代码块的开始和结尾。而VS Code 就是通过对花括号的匹配来决定哪些代码块是能够被折叠的。首先，我们一起来看一下编辑器中最基础的代码折叠方式。比如在下面的这段 JavaScript 代码中：

- 阅读剩余部分 -

VSCode代码片段预设变量，上面我们提到了，在每个 Tab Stop 的位置，我们可以提供占位符，也就是提前预设好一些值。但这些占位符是我们提前写在代码片段里的，跟当前代码的上下文往往没什么关系。不过，VS Code 的代码片段支持里，还提供了一种模板，叫做预设变量。比如说，我们想在代码片段里的某个位置使用剪切板的内容，那么我们在那个位置写上 $CLIPBOARD 就好了，如果我们希望插入代码片段后自己可以修改这个值，也可以将它放在一个 Tab Stop 里面，语法则是 ${1:$CLIPBOARD} 。

- 阅读剩余部分 -

VSCode代码片段多光标，在前面的文章中，我们已经知道多光标能够大幅度减少重复劳动，而在代码片段里，我们也可以使用多光标的特性。上面提到我们可以用 ${1:label} 来指定 Tab Stop 和占位符，但其实我们也可以在代码片段的多个位置使用同样的 Tab Stop 。举个例子，我们可以在代码片段中三个不同的位置插入 $1，这样编辑器就会为这三个不同的位置，分别创建一个光标，然后当我们打字的时候，他们就会被一起修改。下面，我们就一起来给上面的代码片段加上多光标的特性。

- 阅读剩余部分 -