VSCode+Clang+MinGW+OpenGl配置教程

教程
Word count: 2.7k   |   Reading time≈ 11 min

前言

这几天帮别人跑一个天空盒代码，需要用到OpenGl环境，配置过程掉坑比较多略为艰难，因此写个教程记录一下，免得以后换电脑配环境的时候又掉坑233。

顺便吐槽一下，这位仁兄电脑是联想核显，据说因为木有GPU，跑不了OpenGl程序，多好的反面教材😄~ 这里提醒诸君，搞计算机视觉的话，电脑还是独显比较好。

其实很久以前笔者在CodeBlocks上配置过OpenGl环境，当时用的是袁学长提供的傻瓜教程，私以为so easy……In fact，光是环境配置就要了老命，果然配置教程这种东西要及时记录！

掉坑的核心：64位和32位一定要区分清楚，所有配置必须all32或all64，否则程序会出现skipping imcompatible的问题。

——以下配置都是64bit！

老规矩，附上参考链接，向前辈致敬：

链接
1. VSCode配置C/C++环境
2. VSCode配置C/C++环境完整版(附OpenGL配置)
3. 20秒 一键配置 VSCode (Visual Studio Code) C/C++开发环境
4. VS Code + MinGW + Clang + OpenGL (vscode 配置 opengl环境)

VSCode配置C/C++环境

首先，如果你只需要一个在VSCode上的C/C++环境，其他类似OpenGL、OpenCV等等都不需求，那么强烈推荐C参考链接3，全自动傻瓜配置，非常nice。

另外，如果你还没有装VSCode或者想要卸载，推荐参考链接1，里面有VSCode的安装教程，在此就不累述了。

那么，正文开始。

1. 安装Clang

根据维基百科的定义，Clang是一个编译器前端，采用LLVM（一款用来开发编译器前后端的软件）作为其后端。Clang作为GNU编译器套装（GCC）的替代品，支持GNU编译器的大多数编译设定。Clang支持C、C++、Objective-C和Objective-C++。简单来说，我们安装LLVM等同于安装配置Clang。

  • 下载地址：LLVM

以LLVM 11.1.0为例：


笔者的安装位置：D:\Programfiles\LLVM，安装过程中注意勾选：添加环境变量

2. 安装MinGM-W64

首先我们需要大概了解一下MinGM是个啥。前述的Clang作为GCC的替代品，和GCC一样也是主要用在Unix系统下的，我们想在Windows系统中使用Clang，便需要借助MinGM (Minimalist GNU for Windows)的力量。

MinGM简单来讲，就是Window上的GNU开发平台，等于说有了MinGM你不用装linux也可以在Windows上玩GNU。

  • 版本说明：
  • 注意： MinGW是在线安装，但是由于某种不可抗力，安装过程缓慢到不能忍受，因此我最后用的是离线安装的方法。

离线安装方法

  1. 下载X86_64-win32-seh：
    下载地址：MinGW-w64 - for 32 and 64 bit Windows

  2. 解压、合并文件：将解压后mingw64文件夹中的所有文件直接复制到之前的LLVM安装目录D:\Programfiles\LLVM，系统会自动整合同名文件夹中的文件。

  3. 输入clang -v和gcc -v进行测试，出现版本号则安装成功。

    当前系统的环境变量为：

3. 安装VSCode插件

在VSCode左侧的扩展中搜索安装以下插件：

ps，在此之前，建议通过重定向将插件储存位置从C盘改出来:
"D:\Program Files (x86)\Microsoft VS Code\Code.exe" --extensions-dir "D:\Program Files (x86)\Microsoft VS Code\extensions"

  • 插件1：C/C++

  • 插件2：C/C++ Clang Command Adapter

  • 插件3：Code Runner

VSCode配置Gult环境

Gult是OpenGl需要的相关依赖，包括glut.h，glut32.lib，glut32.dll文件。

值得注意的是，由于之前的C++环境是64位的，gult版本必须与之对应，即64位。

  1. 下载glut.h，glut32.lib，glut32.dll：

    下载地址：https://pan.baidu.com/s/1PN_0SxxKGJ-D_AZRDa4LDA 提取码：sf1z

  2. 将gult文件放到相应目录下（LLVM安装路径）：

  • gult.h放到目录：D:\Programfiles\LLVM\include
  • gult32.dll放到目录：D:\Programfiles\LLVM\bin
  • gult32.lib放到目录：D:\Programfiles\LLVM\lib

VSCode配置文件

在文件夹里新建.vscode，include和lib文件夹，include和lib现在先不用管，先专注.vscode文件夹，做VSCode下C/C++环境的基本配置。

在.vscode文件夹里新建c_cpp_properties.json，launch.json，settings.json以及tasks.json。

1. 配置编译器：c_cpp_properties.json

首先配置编译器路径。

方法 1：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
{
    "configurations": [
        {
            "name": "MinGW",
            "intelliSenseMode": "clang-x64",
            "compilerPath": "D:/Programfiles/LLVM/bin/g++.exe", //之前安装的编译器的路径
            "includePath": [
                "${workspaceFolder}/**",
                "${workspaceFolder}/include/*", //当前文件夹下的include
                "D:/Programfiles/LLVM/include/*", //LLVM的include
                "D:/Programfiles/LLVM/lib/gcc/x86_64-w64-mingw32/8.1.0/include/*" //mingw的include
            ],
            "defines": [],
            "browse": {
                "path": [
                    "${workspaceFolder}"
                ],
                "limitSymbolsToIncludedHeaders": true,
                "databaseFilename": ""
            },
            "cStandard": "c11",
            "cppStandard": "c++17"
        }
    ],
    "version": 4
}

方法 2：

参考链接1中配置编译器部分给出了另一种图形化的配置方式。

简单来说就是不需要手动新建.vscode文件夹和c_cpp_properties.json文件，直接用Ctrl+Shift+P调出控制面板，输入C/C++选择Edit Configurations(UI)进入配置。

  • 修改编译器路径：D:/Programfiles/LLVM/bin/g++.exe

  • 修改intelliSense：clang-x64

配置完成后，自动新建了.vscode文件夹和c_cpp_properties.json文件，再在c_cpp_properties文件中修改include路径即可。

2. 配置构建任务tasks.json

tasks.json可以告诉VSCode如何编译程序。

方法 1：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
{
{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Compile", // 任务名称，与launch.json的preLaunchTask相对应
            "command": "clang++",
            "args": [ //编译时的参数
                "${file}",
                "-o", //指定输出文件名
                "${fileDirname}/${fileBasenameNoExtension}.exe",
                "-g", //添加gdb调试选项
                "-Wall",  //开启额外警告
                "-static-libgcc", //静态链接libgcc
                "--target=x86_64-w64-mingw",  //clang编译器需要加上这条，因为它默认的target是msvc；如果用gcc或者linux要注释掉
                "-std=c++17",
                "-I${workspaceFolder}/include", //添加工作路径下的include
                "-L${workspaceFolder}/lib", //添加工作路径下的lib
                "-lglut32", //使用glut
                "-lglu32",  //使用glut
                "-lopengl32", //使用opengl
                "-lglad", //使用glad+glfw，这里可以先注释掉
                "-lglfw3",  //使用glad+glfw，这里可以先注释掉 
                "-lglfw3dll", //使用glad+glfw，这里可以先注释掉
                "-lgdi32",  //使用glad+glfw，这里可以先注释掉
            ],
            "type": "shell",
            "group": {
                "kind": "build",
                "isDefault": true //表示快捷键Ctrl+Shift+B可以运行该任务
            },
            "presentation": {
                "echo": true,
                "reveal": "always", // 执行任务时是否跳转到终端面板
                "focus": false,
                "panel": "shared" // 不同的文件的编译信息共享一个终端面板
            },
            "problemMatcher": []
        }
    ]
}

方法 2：

参考链接1中配置构建任务部分给出了另一种图形化的配置方式。

不需要手动新建tasks.json文件，直接用Ctrl+Shift+P调出控制面板，输入tasks选择Tasks:Configure Default Build Task，自动生成tasks.json文件，主要修改其中的"args"参数部分。

配置调试设置launch.json

launch.json用来配置调试的相关信息。

方法 1：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "(gdb) Launch", // 配置名称，将会在启动配置的下拉菜单中显示
            "type": "cppdbg", // 配置类型，cppdbg对应cpptools提供的调试功能；可以认为此处只能是cppdbg
            "request": "launch", // 请求配置类型，可以为launch（启动）或attach（附加）
            "program": "${fileDirname}/${fileBasenameNoExtension}.exe", // 将要进行调试的程序的路径
            "args": [], // 程序调试时传递给程序的命令行参数，一般设为空即可
            "stopAtEntry": false, // 设为true时程序将暂停在程序入口处，相当于在main上打断点
            "cwd": "${workspaceFolder}", // 调试程序时的工作目录，此为工作区文件夹；改成${fileDirname}可变为文件所在目录
            "environment": [], // 环境变量
            "externalConsole": false, // 为true时使用单独的cmd窗口，与其它IDE一致；18年10月后设为false可调用VSC内置终端
            "internalConsoleOptions": "neverOpen", // 如果不设为neverOpen，调试时会跳到“调试控制台”选项卡，你应该不需要对gdb手动输命令吧？
            "MIMode": "gdb", // 指定连接的调试器，可以为gdb或lldb。但我没试过lldb
            "miDebuggerPath": "gdb.exe", // 调试器路径，Windows下后缀不能省略，Linux下则不要
            "setupCommands": [
                { // 模板自带，好像可以更好地显示STL容器的内容，具体作用自行Google
                    "description": "Enable pretty-printing for gdb",
                    "text": "-enable-pretty-printing",
                    "ignoreFailures": false
                }
            ],
            "preLaunchTask": "Compile" // 调试会话开始前执行的任务，一般为编译程序。与tasks.json的label相对应
        }
    ]
}

方法 2：

菜单栏运行-启动调试-C++(GDB/LLDB)，自动生成一个launch.json文件，再根据需要修改相关配置。

ps，不推荐该方法，原博主也遇到了没解决的问题，笔者也没深究，还是建议方法1。

配置用户设置settings.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
{
  "files.defaultLanguage": "cpp", // ctrl+N新建文件后默认的语言
  "editor.formatOnType": true, // 输入时就进行格式化，默认触发字符较少，分号可以触发
  "editor.snippetSuggestions": "top", // snippets代码优先显示补全
  "code-runner.runInTerminal": true, // 设置成false会在“输出”中输出，无法输入
  "code-runner.executorMap": {
      "c": "cd $dir && clang $fileName -o $fileNameWithoutExt.exe -Wall -g -Og -static-libgcc -fcolor-diagnostics --target=x86_64-w64-mingw -std=c11 && $dir$fileNameWithoutExt",
      "cpp": "cd $dir && clang++ $fileName -o $fileNameWithoutExt.exe -Wall -g -Og -static-libgcc -fcolor-diagnostics --target=x86_64-w64-mingw -lglut32 -lglu32 -lopengl32 -std=c++17 && $dir$fileNameWithoutExt" 
  }, // 设置code runner的命令行
  "code-runner.saveFileBeforeRun": true, // run code前保存
  "code-runner.preserveFocus": true, // 若为false，run code后光标会聚焦到终端上。如果需要频繁输入数据可设为false
  "code-runner.clearPreviousOutput": false, // 每次run code前清空属于code runner的终端消息

  "C_Cpp.clang_format_sortIncludes": true, // 格式化时调整include的顺序（按字母排序）
  "C_Cpp.intelliSenseEngine": "Default", // 可以为Default或Tag Parser，后者较老，功能较简单。具体差别参考cpptools扩展文档
  "C_Cpp.errorSquiggles": "Disabled", // 因为有clang的lint，所以关掉
  "C_Cpp.autocomplete": "Disabled", // 因为有clang的补全，所以关掉

  "clang.cflags": [ // 控制c语言静态检测的参数
      "--target=x86_64-w64-mingw",
      "-std=c11",
      "-Wall",
      "-I./include",
      "-L./lib"
  ],
  "clang.cxxflags": [ // 控制c++静态检测时的参数
      "--target=x86_64-w64-mingw",
      "-std=c++17",
      "-Wall",
      "-I./include",
      "-L./lib"
  ],
  "clang.completion.enable":true, // 效果效果比cpptools要好
  "clang.diagnostic.delay":300
}

值得注意的是，之前我run code一直报错找不到一些glut函数定义，只有debug能跑。后来发现问题出在code-runner.executorMap这里。

之前tasks.json中调试参数部分为：

而settings.json的code-runner.executorMap部分需要与之对应：

加上红框部分就能run code了。

迁移

至此VSCode配置结束，之后跑新的C++项目只需要将.vscode文件夹复制过去就行，如果要用到其他库，只需要对其中一些参数稍作修改。

测试

最后，我们建个main.cpp来测试一下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
#include <glut.h>
void init();
void display();
int main(int argc, char* argv[]){
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_RGB | GLUT_SINGLE);
    glutInitWindowPosition(800, 150);
    glutInitWindowSize(600, 400);
    glutCreateWindow("OpenGL 3D View");
    init();
    glutDisplayFunc(display);
    glutMainLoop();
    return 0;
}
void init(){
    glClearColor(0.0, 0.0, 0.0, 0.0);
    glMatrixMode(GL_PROJECTION);
    glOrtho(-5, 5, -5, 5, 5, 15);
    glMatrixMode(GL_MODELVIEW);
    gluLookAt(0, 0, 10, 0, 0, 0, 0, 1, 0);
}
void display(){
    glClear(GL_COLOR_BUFFER_BIT);
    glColor3f(0, 1.0, 0);
    glutWireTeapot(3);
    glFlush();
}

run code：

大功告成！☀🐱~

后记

emm，没啥好说的啦，干的不错喵喵喵~

  • Copyrights © 2021-2022 阿波罗猫

请我喝杯咖啡吧~

支付宝
微信