228
VSCode 是微軟一個基于 Electron 框架開發(fā)的新一代開源代碼編輯器。之前我們在講述 C 語言的時候，都是將其定位成為一個代碼編輯器來使用的。使用其內嵌的 Windows power shell 當作命令行終端來執(zhí)行 MinGW 的便宜命令，這種方式雖然比較麻煩，但是其開發(fā)的過程和方法最大地逼近了 Linux 下 C 語言的開發(fā)，因此，我們在之前的 C 語言講述過程中，選擇使用了這種開發(fā)方式。但是，這種方式隨著你代碼的復雜度提升，如果使用 gdb 工具去做代碼的調試，其實是很不方便的，因為命令行為主的操作方式永遠都比不過圖形化界面來的方便。
本文的內容，將會講述如何使用 VSCode 來配置 MinGW 工具，以達到配置出一個可以直接編譯和調試代碼的 C 語言開發(fā)環(huán)境。
MinGW 的安裝
公眾號回復“GCC“即可獲取 MinGW 的下載鏈接。
使用過程很簡單，只需要將我們的軟件包解壓，放到一個特定的位置，如圖 1 所示。
圖 1 MinGW 文件夾
以上的文件夾里面，bin 文件夾存放了所有的 GCC 相關可執(zhí)行文件，因此我們需要將其添加到環(huán)境變量里面。右擊“計算機“->”屬性”->”高級系統(tǒng)設置”，在彈出的窗口里面選擇”高級“標簽，再點擊”環(huán)境變量“，如圖 2 所示。
圖 2 打開環(huán)境變量
然后點擊“新建“，輸入剛剛 MinGW 的路徑，記住這里需要把路徑定位到 bin 文件夾里面，即輸入” C:MinGW64bin“。如圖 3 所示。然后依次點擊”確定“退出。
圖 3 添加環(huán)境變量
完成上述操作后，來測試一下環(huán)境變量是否添加成功。點擊“開始“菜單，輸入”cmd“打開”命令操作符“，輸入”gcc -v“如果設置都正確，”命令操作符“會輸出 gcc 的版本號，如圖 4 所示。
圖 4 gcc 安裝完成
VSCode 安裝
VSCode 文本編輯器選用的是當下最火的開源軟件，微軟出品的“visual studio code”，這是一個微軟出品的開源跨平臺文本編輯器。下載鏈接：
https://code.visualstudio.com/Download。這個編輯軟件下載下來，下載界面如圖 5 所示，注意下載的時候，選擇“Userinstaller”，然后根據(jù)自己電腦的操作系統(tǒng)進行下載。下載完成之后，按照安裝向導進行安裝，安裝路徑可以自己隨意指定。
圖 5 Visualstudio code 下載界面
下載完成之后，默認在桌面上是不會出現(xiàn)快捷方式的，因此需要在搜索菜單里面找到“visual studio code”軟件打開，如圖 6 所示。軟件的打開界面如圖 7 所示。
圖 6 打開 Visual studio code
圖 7 Visualstudio code 軟件界面
配置 VSCode
首先，我們先創(chuàng)建一個文件夾，用以存放我們的代碼，假設我們需要創(chuàng)建的一個文件夾名稱為“NumCal”，其位置就位于桌面上。然后我們直接使用 VSCode 來打開這個文件夾，如圖 8 所示。
圖 8 VSCode 打開文件夾
打開完成文件夾之后，我們就可以在里面創(chuàng)建 .c 文件并且編寫一些代碼了，假設我們在這里先創(chuàng)建一個“main.c”的源文件，然后編寫幾行很簡單的代碼，如，判斷一個輸入的數(shù)值大小，如果輸入的數(shù)值在 1~100 之間就輸出“Small”，如果在 101~200 之間就輸出“Middle”，其余情況都輸出“Large”，這個代碼如圖 9 所示。
圖 9 數(shù)字判斷代碼
#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;}
在這些操作都完成之后，我們現(xiàn)在先來試一下使用 VSCode 的調試功能，點擊菜單欄的“運行”，然后再彈出的菜單里選擇“啟動調試”。如圖 10 所示。
圖 10 啟動代碼調試
此時，VSCode 會彈出一個選項，讓你選擇合適的調試器，這里我們選擇“C++(GDB/LLDB)”，如圖 11 所示。
圖 11 調試器選擇
本想著這一次操作可以開啟我們使用 VSCode 的新世界，但是隨即而來的是一桶刺骨的冷水，因為它彈出了如圖 12 所示的這一個讓人看不懂的界面，這個界面里的內容既像代碼，又不像代碼，如圖 12 所示。
圖 12 彈出的看不懂的東西
細心的觀眾會發(fā)現(xiàn)，這一個類似于代碼的東西，它好像是被自動生成且保存至本地的“.vscode”文件夾里面的。其實如果有做前端的童鞋就知道，這個 json 文件其實是一種類似于 XML 的輕型數(shù)據(jù)文件，本廣泛地用以前端和服務器之間的數(shù)據(jù)交互。但是為什么 VSCode 里面也會有這個東西呢？這是由于 VSCode 是用 Electron 框架開發(fā)的，Election 框架的核心編程語言是 Node.js，Node.js 可以簡單地理解成一種可以運行在操作系統(tǒng)本地的，脫離瀏覽器環(huán)境的 JavaScript，所以就不難理解，為何 VSCode 要用 json 文件來存儲數(shù)據(jù)了。
圖 13 使用 Electron 框架，Node.js 和 Chrome V8 引擎技術開發(fā)的 VSCode
在了解完成 launch.json 是什么東西之后，我們就來說一下其作用。launch.json 其實顧名思義就知道，它作用是在 C 語言文件啟動調試時提供配置參數(shù)。這些參數(shù)具體有什么作用呢？它們的作用參考圖 14。
圖 14 launch.json 文件配置內容注釋
現(xiàn)在我們可以根據(jù)圖 14 所示的注釋，對 launch.json 文件中的內容進行完善。完善之后的代碼如圖 15 所示。
圖 15 修改好的 launch.json
{// 使用 IntelliSense 了解相關屬性。// 懸停以查看現(xiàn)有屬性的描述。// 欲了解更多信息，請訪問: 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": [], // 程序調試時傳遞給程序的命令行參數(shù)，一般設為空即可"stopAtEntry": false, // 設為 true 時程序將暫停在程序入口處，一般設置為 false"cwd": "${fileDirname}", // 調試程序時的工作目錄，一般為${fileDirname}即代碼所在目錄"environment": [],"externalConsole": true, // 調試時是否顯示控制臺窗口，一般設置為 true 顯示控制臺"MIMode": "gdb","miDebuggerPath": "D:/software/mingw64/bin/gdb.exe", // miDebugger 的路徑，注意這里要與 MinGw 的路徑對應"preLaunchTask": "gcc", // 這里需要添加一個參數(shù)，// 調試會話開始前執(zhí)行的任務，一般為編譯程序，c++為 g++, c 為 gcc"setupCommands": [{"description": "為 gdb 啟用整齊打印","text": "-enable-pretty-printing","ignoreFailures": true}]}]}
此時，我們編輯好這個文件之后，再選擇點擊菜單欄的“運行”，然后再彈出的菜單里選擇“啟動調試”。隨之而來，一聲悲愴的提示音，又給我們冰冷的內心吹了兩三遍西北風。彈出的窗口如圖 16 所示。
圖 16 彈出的錯誤
圖 16 彈出的窗口，傷害性雖然不大，但是極具侮辱性極高，它使用我們每個都認識的漢字，給我們提示出了這個錯誤，原來是沒有找到任務“gcc”啊。但問題是怎么去找 gcc 呢？首先先來解釋，為什么會彈出這個錯誤，因為我們在配置 launch.json 文件的時候，選擇了調試之前要先執(zhí)行 gcc 任務，那么這個 gcc 任務到底是什么，VSCode 不知道，因此提示我們需要配置。
在彈出的這個提示框上面，選擇“配置任務”，隨之而來會彈出一個選項，“使用模板創(chuàng)建 task.json 文件”，如圖 17 所示。
圖 17 “使用模板創(chuàng)建 task.json 文件”
遇到這種情況，我們需要毫不猶豫地點下去。點下去之后，又彈出如圖 18 所示的現(xiàn)象。
圖 18 MSBuild 生成“task.json”
此時，我們直接選擇第一項“MSBuild 執(zhí)行生成目標”。這時候，又彈出了一個 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 語言調試已經(jīng)配置完成了，接下來，我們可以返回 main.c 文件對其設置一些斷點，設置完成之后，點擊菜單欄的“運行”，然后再彈出的菜單里選擇“啟動調試”，就可以進入 C 語言調試了。如圖 20 所示。
圖 20 C 語言調試界面
