告别Qt Creator！在VSCode里用CMake+MinGW搞定Qt 5.9.9界面开发（保姆级配置）

在VSCode中构建Qt 5.9.9开发环境：CMake与MinGW全流程指南

Qt Creator虽然功能强大，但对于习惯使用VSCode的开发者来说，频繁切换开发环境会降低工作效率。本文将详细介绍如何在VSCode中配置完整的Qt 5.9.9开发环境，使用CMake作为构建工具，MinGW作为编译器，实现从项目创建到调试的全流程开发。

1. 环境准备与安装

在开始配置之前，我们需要确保所有必要的软件组件都已正确安装。Qt 5.9.9是一个长期支持版本(LTS)，具有出色的稳定性和广泛的社区支持，特别适合需要长期维护的项目。

所需软件清单：

• Visual Studio Code (最新稳定版)
• Qt 5.9.9开源版本
• CMake 3.23或更高版本
• MinGW编译器(建议使用Qt自带的版本)

安装过程中有几个关键点需要注意：

1. CMake安装：选择"Add CMake to the system PATH"选项，这样VSCode可以自动找到CMake可执行文件。安装完成后，在命令行中运行cmake --version验证安装是否成功。

2. Qt安装：在组件选择界面，确保勾选以下关键组件：

   • Qt 5.9.9 → MinGW 5.3.0 32-bit
   • Qt Charts
   • Qt Data Visualization
   • Qt Quick Controls 2

3. VSCode插件：安装以下必备扩展：

   • C/C++ (Microsoft)
   • CMake Tools
   • CMake Language Support
   • Qt Configure
   • Qt Tools

提示：安装完成后，建议将Qt的MinGW路径(通常是Qt安装目录\Tools\mingw530_32\bin)添加到系统PATH环境变量中，这样可以确保在命令行中直接调用g++等工具。

2. 配置VSCode的Qt开发环境

正确安装所有软件后，我们需要对VSCode进行专门配置，使其能够识别Qt开发环境。

2.1 基本配置

首先，在VSCode中打开设置(快捷键Ctrl+,)，搜索"cmake.generator"，将其设置为"MinGW Makefiles"。这是因为我们将使用MinGW作为编译器。

接下来，配置Qt路径。在用户设置中添加以下内容：

{ "qt.path": "C:/Qt/5.9.9/mingw53_32", "cmake.configureArgs": [ "-DCMAKE_PREFIX_PATH=C:/Qt/5.9.9/mingw53_32/lib/cmake" ] }

请根据实际安装路径调整上述配置。这些设置告诉CMake在哪里可以找到Qt的库文件和头文件。

2.2 创建CMake项目

现在我们可以创建一个基本的Qt项目：

1. 新建一个文件夹作为项目根目录
2. 在VSCode中打开该文件夹
3. 按Ctrl+Shift+P打开命令面板，输入"CMake: Quick Start"
4. 选择"MinGW"作为工具包
5. 输入项目名称(如"MyQtApp")
6. 选择"Executable"作为项目类型

这将生成一个基本的CMake项目结构。我们需要修改自动生成的CMakeLists.txt文件，使其支持Qt开发。

3. CMakeLists.txt配置详解

Qt项目需要特殊的CMake配置才能正确编译。以下是完整的CMakeLists.txt示例：

cmake_minimum_required(VERSION 3.5) project(MyQtApp LANGUAGES CXX) # 查找Qt库 set(CMAKE_AUTOMOC ON) set(CMAKE_AUTORCC ON) set(CMAKE_AUTOUIC ON) find_package(Qt5 REQUIRED COMPONENTS Widgets) # 添加可执行文件 add_executable(MyQtApp main.cpp mainwindow.cpp mainwindow.h mainwindow.ui ) # 链接Qt库 target_link_libraries(MyQtApp Qt5::Widgets) # 安装规则(可选) install(TARGETS MyQtApp RUNTIME DESTINATION bin)

关键配置说明：

1. CMAKE_AUTOMOC/AUTORCC/AUTOUIC：这些选项启用Qt的元对象编译器、资源编译器和用户界面编译器，简化开发流程。

2. find_package：查找并加载Qt5的Widgets模块。如果需要其他模块(如Charts、Network等)，可以在这里添加。

3. target_link_libraries：将Qt库链接到我们的应用程序。

对于更复杂的项目，可能还需要添加以下配置：

# 设置C++标准 set(CMAKE_CXX_STANDARD 11) set(CMAKE_CXX_STANDARD_REQUIRED ON) # 添加资源文件 qt5_add_resources(RESOURCES resource.qrc) # 添加翻译文件 qt5_add_translation(QM_FILES translation.ts)

4. 项目结构与UI设计

在VSCode中开发Qt应用时，项目结构与传统Qt Creator项目类似，但有一些关键区别：

MyQtApp/ ├── CMakeLists.txt ├── main.cpp ├── mainwindow.h ├── mainwindow.cpp ├── mainwindow.ui └── resource.qrc

4.1 使用Qt Designer

虽然我们不在Qt Creator中开发，但仍然可以使用独立的Qt Designer工具来设计界面：

1. 在开始菜单中找到并打开"Qt Designer"
2. 创建新的MainWindow窗体
3. 设计界面并保存为.ui文件
4. 将.ui文件放在项目目录中

VSCode的Qt Tools插件可以预览.ui文件，但功能不如Qt Designer完整。对于复杂界面，建议使用独立的设计器工具。

4.2 资源文件管理

Qt使用.qrc文件管理资源(如图片、图标等)。在项目根目录创建resource.qrc文件：

<RCC> <qresource prefix="/"> <file>images/icon.png</file> </qresource> </RCC>

然后在CMakeLists.txt中添加：

qt5_add_resources(RESOURCES resource.qrc) add_executable(MyQtApp ... ${RESOURCES})

5. 构建与调试

配置完成后，就可以在VSCode中构建和调试Qt应用了。

5.1 构建项目

1. 按Ctrl+Shift+P打开命令面板
2. 输入"CMake: Build"或点击底部状态栏的"Build"按钮
3. 构建输出将显示在终端中

如果遇到构建错误，常见原因包括：

• 未正确设置Qt路径
• CMake找不到MinGW编译器
• 缺少必要的Qt组件

5.2 调试配置

为了在VSCode中调试Qt应用，需要配置launch.json文件：

{ "version": "0.2.0", "configurations": [ { "name": "Debug Qt App", "type": "cppdbg", "request": "launch", "program": "${workspaceFolder}/build/MyQtApp.exe", "args": [], "stopAtEntry": false, "cwd": "${workspaceFolder}", "environment": [ { "name": "PATH", "value": "${env:PATH};C:/Qt/5.9.9/mingw53_32/bin" } ], "externalConsole": false, "MIMode": "gdb", "miDebuggerPath": "C:/Qt/Tools/mingw530_32/bin/gdb.exe", "setupCommands": [ { "description": "Enable pretty-printing for gdb", "text": "-enable-pretty-printing", "ignoreFailures": true } ] } ] }

关键配置项：

• program：指向构建生成的可执行文件
• miDebuggerPath：指定MinGW的gdb路径
• environment：添加Qt的bin目录到PATH

6. 高级配置与技巧

6.1 多模块项目

对于大型项目，可以将代码组织成多个模块：

MyProject/ ├── CMakeLists.txt ├── app/ │ ├── CMakeLists.txt │ └── (应用程序代码) └── lib/ ├── CMakeLists.txt └── (库代码)

顶层CMakeLists.txt:

cmake_minimum_required(VERSION 3.5) project(MyProject LANGUAGES CXX) add_subdirectory(lib) add_subdirectory(app)

库模块CMakeLists.txt:

add_library(MyLib STATIC mylib.cpp mylib.h ) target_include_directories(MyLib PUBLIC ${CMAKE_CURRENT_SOURCE_DIR})

应用模块CMakeLists.txt:

add_executable(MyApp main.cpp ) target_link_libraries(MyApp MyLib Qt5::Widgets)

6.2 使用现代C++特性

Qt 5.9.9支持C++11，可以在CMake中启用：

set(CMAKE_CXX_STANDARD 11) set(CMAKE_CXX_STANDARD_REQUIRED ON)

如果使用C++14或更高版本，需要确保MinGW版本支持这些特性。

6.3 处理常见问题

问题1：找不到Qt模块解决方案：确保在CMakeLists.txt中正确设置了CMAKE_PREFIX_PATH，并且find_package指定了所有需要的组件。

问题2：运行时缺少DLL解决方案：将Qt的bin目录(包含所有DLL文件)添加到系统PATH，或将必要的DLL复制到可执行文件目录。

问题3：调试时无法显示Qt对象解决方案：在gdb控制台输入以下命令加载Qt打印器：

python import sys sys.path.insert(0, 'C:/Qt/5.9.9/mingw53_32/share/qt5/gdbmacros') from qt import * end

7. 工作流优化

为了提高开发效率，可以配置一些有用的VSCode设置：

{ "cmake.buildDirectory": "${workspaceFolder}/build", "cmake.configureOnOpen": true, "C_Cpp.intelliSenseEngine": "Default", "C_Cpp.default.cppStandard": "c++11", "files.associations": { "*.ui": "xml", "*.qrc": "xml" } }

此外，可以创建一些有用的代码片段。例如，在.vscode/qt.code-snippets中添加：

{ "Qt MainWindow": { "prefix": "qtmain", "body": [ "#include <QMainWindow>", "", "class ${1:MainWindow} : public QMainWindow", "{", " Q_OBJECT", "", "public:", " ${1:MainWindow}(QWidget *parent = nullptr);", " ~${1:MainWindow}();", "};" ] } }

在实际项目中，我发现将VSCode的任务系统与CMake结合使用可以进一步提高效率。例如，可以配置一个任务来清理构建目录：

{ "label": "Clean Build", "type": "shell", "command": "rm -rf build && mkdir build", "options": { "cwd": "${workspaceFolder}" } }