251
VSCode 是微软一个基于 Electron 框架开发的新一代开源代码编辑器。之前我们在讲述 C 语言的时候，都是将其定位成为一个代码编辑器来使用的。使用其内嵌的 Windows power shell 当作命令行终端来执行 MinGW 的便宜命令，这种方式虽然比较麻烦，但是其开发的过程和方法最大地逼近了 Linux 下 C 语言的开发，因此，我们在之前的 C 语言讲述过程中，选择使用了这种开发方式。但是，这种方式随着你代码的复杂度提升，如果使用 gdb 工具去做代码的调试，其实是很不方便的，因为命令行为主的操作方式永远都比不过图形化界面来的方便。
本文的内容，将会讲述如何使用 VSCode 来配置 MinGW 工具，以达到配置出一个可以直接编译和调试代码的 C 语言开发环境。
MinGW 的安装
公众号回复“GCC“即可获取 MinGW 的下载链接。
使用过程很简单，只需要将我们的软件包解压，放到一个特定的位置，如图 1 所示。
图 1 MinGW 文件夹
以上的文件夹里面，bin 文件夹存放了所有的 GCC 相关可执行文件，因此我们需要将其添加到环境变量里面。右击“计算机“->”属性”->”高级系统设置”，在弹出的窗口里面选择”高级“标签，再点击”环境变量“，如图 2 所示。
图 2 打开环境变量
然后点击“新建“，输入刚刚 MinGW 的路径，记住这里需要把路径定位到 bin 文件夹里面，即输入” C:MinGW64bin“。如图 3 所示。然后依次点击”确定“退出。
图 3 添加环境变量
完成上述操作后，来测试一下环境变量是否添加成功。点击“开始“菜单，输入”cmd“打开”命令操作符“，输入”gcc -v“如果设置都正确，”命令操作符“会输出 gcc 的版本号，如图 4 所示。
图 4 gcc 安装完成
VSCode 安装
VSCode 文本编辑器选用的是当下最火的开源软件，微软出品的“visual studio code”，这是一个微软出品的开源跨平台文本编辑器。下载链接：
https://code.visualstudio.com/Download。这个编辑软件下载下来，下载界面如图 5 所示，注意下载的时候，选择“Userinstaller”，然后根据自己电脑的操作系统进行下载。下载完成之后，按照安装向导进行安装，安装路径可以自己随意指定。
图 5 Visualstudio code 下载界面
下载完成之后，默认在桌面上是不会出现快捷方式的，因此需要在搜索菜单里面找到“visual studio code”软件打开，如图 6 所示。软件的打开界面如图 7 所示。
图 6 打开 Visual studio code
图 7 Visualstudio code 软件界面
配置 VSCode
首先，我们先创建一个文件夹，用以存放我们的代码，假设我们需要创建的一个文件夹名称为“NumCal”，其位置就位于桌面上。然后我们直接使用 VSCode 来打开这个文件夹，如图 8 所示。
图 8 VSCode 打开文件夹
打开完成文件夹之后，我们就可以在里面创建 .c 文件并且编写一些代码了，假设我们在这里先创建一个“main.c”的源文件，然后编写几行很简单的代码，如，判断一个输入的数值大小，如果输入的数值在 1~100 之间就输出“Small”，如果在 101~200 之间就输出“Middle”，其余情况都输出“Large”，这个代码如图 9 所示。
图 9 数字判断代码
#include#include "a.h"int main(void) {int number;printf("input:n");scanf("%d", &number);if((number > 1) && (number <= 100)) {printf("Smalln");} else if((number > 101) && (number <= 200)) {printf("Middlen");} else {printf("Largen");}return 0;}
在这些操作都完成之后，我们现在先来试一下使用 VSCode 的调试功能，点击菜单栏的“运行”，然后再弹出的菜单里选择“启动调试”。如图 10 所示。
图 10 启动代码调试
此时，VSCode 会弹出一个选项，让你选择合适的调试器，这里我们选择“C++(GDB/LLDB)”，如图 11 所示。
图 11 调试器选择
本想着这一次操作可以开启我们使用 VSCode 的新世界，但是随即而来的是一桶刺骨的冷水，因为它弹出了如图 12 所示的这一个让人看不懂的界面，这个界面里的内容既像代码，又不像代码，如图 12 所示。
图 12 弹出的看不懂的东西
细心的观众会发现，这一个类似于代码的东西，它好像是被自动生成且保存至本地的“.vscode”文件夹里面的。其实如果有做前端的童鞋就知道，这个 json 文件其实是一种类似于 XML 的轻型数据文件，本广泛地用以前端和服务器之间的数据交互。但是为什么 VSCode 里面也会有这个东西呢？这是由于 VSCode 是用 Electron 框架开发的，Election 框架的核心编程语言是 Node.js，Node.js 可以简单地理解成一种可以运行在操作系统本地的，脱离浏览器环境的 JavaScript，所以就不难理解，为何 VSCode 要用 json 文件来存储数据了。
图 13 使用 Electron 框架，Node.js 和 Chrome V8 引擎技术开发的 VSCode
在了解完成 launch.json 是什么东西之后，我们就来说一下其作用。launch.json 其实顾名思义就知道，它作用是在 C 语言文件启动调试时提供配置参数。这些参数具体有什么作用呢？它们的作用参考图 14。
图 14 launch.json 文件配置内容注释
现在我们可以根据图 14 所示的注释，对 launch.json 文件中的内容进行完善。完善之后的代码如图 15 所示。
图 15 修改好的 launch.json
{// 使用 IntelliSense 了解相关属性。// 悬停以查看现有属性的描述。// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387"version": "0.2.0","configurations": [{"name": "build and debug", // 配置名称，将会在启动配置的下拉菜单中显示"type": "cppdbg", // 配置类型，这里只能为 cppdbg"request": "launch", // 请求配置类型，可以为 launch（启动）或 attach（附加）"program": "${fileDirname}/${fileBasenameNoExtension}.exe",// 将要进行调试的程序的路径"args": [], // 程序调试时传递给程序的命令行参数，一般设为空即可"stopAtEntry": false, // 设为 true 时程序将暂停在程序入口处，一般设置为 false"cwd": "${fileDirname}", // 调试程序时的工作目录，一般为${fileDirname}即代码所在目录"environment": [],"externalConsole": true, // 调试时是否显示控制台窗口，一般设置为 true 显示控制台"MIMode": "gdb","miDebuggerPath": "D:/software/mingw64/bin/gdb.exe", // miDebugger 的路径，注意这里要与 MinGw 的路径对应"preLaunchTask": "gcc", // 这里需要添加一个参数，// 调试会话开始前执行的任务，一般为编译程序，c++为 g++, c 为 gcc"setupCommands": [{"description": "为 gdb 启用整齐打印","text": "-enable-pretty-printing","ignoreFailures": true}]}]}
此时，我们编辑好这个文件之后，再选择点击菜单栏的“运行”，然后再弹出的菜单里选择“启动调试”。随之而来，一声悲怆的提示音，又给我们冰冷的内心吹了两三遍西北风。弹出的窗口如图 16 所示。
图 16 弹出的错误
图 16 弹出的窗口，伤害性虽然不大，但是极具侮辱性极高，它使用我们每个都认识的汉字，给我们提示出了这个错误，原来是没有找到任务“gcc”啊。但问题是怎么去找 gcc 呢？首先先来解释，为什么会弹出这个错误，因为我们在配置 launch.json 文件的时候，选择了调试之前要先执行 gcc 任务，那么这个 gcc 任务到底是什么，VSCode 不知道，因此提示我们需要配置。
在弹出的这个提示框上面，选择“配置任务”，随之而来会弹出一个选项，“使用模板创建 task.json 文件”，如图 17 所示。
图 17 “使用模板创建 task.json 文件”
遇到这种情况，我们需要毫不犹豫地点下去。点下去之后，又弹出如图 18 所示的现象。
图 18 MSBuild 生成“task.json”
此时，我们直接选择第一项“MSBuild 执行生成目标”。这时候，又弹出了一个 json 文件，这个 json 文件就是我们前面多次看到的那个“task.json”，此时我们又需要对这个文件再配置一次。配置文件的内容如图 19 所示。
图 19 task.json 文件
{"version": "2.0.0","label": "C/C++: gcc.exe build active file","command": "gcc","args": ["-g","${file}","-o","${fileDirname}\${fileBasenameNoExtension}.exe"],"problemMatcher": ["$gcc"],"group": "build","detail": "compiler: D:\software\mingw64\bin\gcc.exe",}
至此为止，整个 VSCode C 语言调试已经配置完成了，接下来，我们可以返回 main.c 文件对其设置一些断点，设置完成之后，点击菜单栏的“运行”，然后再弹出的菜单里选择“启动调试”，就可以进入 C 语言调试了。如图 20 所示。
图 20 C 语言调试界面
