C 语言

关注公众号 jb51net

关闭
首页 > 软件编程 > C 语言 > VSCode Qt CMake

VSCode+Qt+CMake详细教程

作者:谱写秋天

本文详解如何在VSCode中搭建Qt与CMake开发环境,涵盖安装步骤、配置Qt路径、编写CMakeLists.txt及项目构建运行流程,强调扩展工具链的使用,助力实现高效跨平台Qt C++开发,本文给大家介绍的非常详细,感兴趣的朋友一起看看吧

第一部分:环境准备与安装

1. 安装 VSCode

  1. 访问 VSCode 官网 下载并安装。
  2. 安装完成后,打开 VSCode,安装以下必备扩展:
    • C/C++ (Microsoft): 提供 C/C++ 语言的 IntelliSense、调试等功能。
    • CMake (Microsoft): 提供 CMake 项目的构建、调试、配置支持。
    • CMake Tools (Microsoft): CMake 扩展的增强工具,是核心。
    • (可选) Qt Configure (TheQtCompany): 帮助配置 Qt 环境,提供 .ui 文件预览等功能。
    • (可选) Qt Tools (TheQtCompany): 提供 Qt 特有的语法高亮等。

2. 安装 Qt

  1. 访问 Qt 官网 下载 Qt Online Installer
  2. 运行安装程序,登录或注册 Qt 账户。
  3. 在选择组件页面,至关重要的一步:
    • 选择最新的 Qt 版本 (如 Qt 6.7.0)。
    • 展开该版本,勾选以下组件:
      • MSVC 2019 64-bit (如果你在 Windows 上使用 Visual Studio 的编译器)
      • MinGW 11.2.0 64-bit (如果你使用 MinGW 编译器)
      • Android, iOS, macOS 等 (根据你的目标平台选择)。
    • 务必勾选 SourcesDebugging Tools for Windows (Windows MSVC 下),这对调试非常有帮助。
    • 勾选 Qt Creator(虽然我们用 VSCode,但 Qt Creator 自带了许多有用的工具,如 qmake, uic, moc 等,这些工具在构建时是必需的)。
    建议: 如果你使用 MSVC,请确保系统已安装对应版本的 Visual Studio Build ToolsVisual Studio

3. 安装 CMake

  1. 访问 CMake 官网 下载安装包。
  2. 安装时,务必勾选 “Add CMake to the system PATH for all users”,这样 VSCode 和终端才能找到它。
  3. 安装完成后,打开终端 (CMD/PowerShell),输入 cmake --version 验证是否安装成功。

4. 安装编译器 (如果未安装)

第二部分:配置 VSCode 环境

1. 配置 Qt 路径

VSCode 需要知道 Qt 的安装位置,以便 CMake Tools 扩展能找到 Qt 的库和工具。

  1. 打开 VSCode 的设置 (Ctrl+,)。
  2. 搜索 cmake kit
  3. 找到 Cmake: Kits 设置,点击 “在 settings.json 中编辑”
  4. 这会打开 settings.json 文件。我们需要添加一个 “Kit”

示例配置 (请根据你的实际路径修改):

{
    "cmake.configureOnOpen": false, // 可选:建议关闭,手动配置
    "cmake.generator": "Ninja",     // 可选:推荐使用更快的 Ninja 代替 NMake
    "cmake.kits": [
        {
            "name": "Qt-6.7.0-MSVC2019_64",
            "compilers": {
                "C": "C:/Program Files (x86)/Microsoft Visual Studio/2019/Community/VC/Tools/MSVC/14.29.30133/bin/Hostx64/x64/cl.exe",
                "CXX": "C:/Program Files (x86)/Microsoft Visual Studio/2019/Community/VC/Tools/MSVC/14.29.30133/bin/Hostx64/x64/cl.exe"
            },
            "environmentVariables": {
                // 将 Qt 的 bin 目录和编译器的目录添加到 PATH
                "PATH": "C:/Qt/6.7.0/msvc2019_64/bin;C:/Program Files (x86)/Microsoft Visual Studio/2019/Community/VC/Tools/MSVC/14.29.30133/bin/Hostx64/x64;${env:PATH}"
            },
            "qtDir": "C:/Qt/6.7.0/msvc2019_64" // 最关键的一行,指向你的 Qt 安装目录
        }
    ]
}

更简单的方法:
很多时候,CMake Tools 会自动扫描系统并生成 Kits。安装完上述软件后,重启 VSCode,点击底部状态栏的 “No Kit Selected” 或已选择的 Kit 名称,可能会自动弹出检测到的 Kits 列表(包括上面配置的),直接选择即可。

第三部分:创建并配置一个 CMake Qt 项目

1. 项目结构

创建一个新的项目文件夹,结构如下:

my_qt_app/
├── CMakeLists.txt
├── main.cpp
├── MainWindow.cpp
├── MainWindow.h
├── MainWindow.ui (可选,UI文件)
└── resources.qrc (可选,资源文件)

2. 编写 CMakeLists.txt

这是 CMake 构建系统的核心配置文件。

# 指定 CMake 的最低版本要求。Qt6 推荐使用 3.16 或更高版本。
cmake_minimum_required(VERSION 3.16)
# 设置项目名称和版本
project(MyQtApp VERSION 1.0.0 LANGUAGES CXX)
# 设置 C++ 标准
set(CMAKE_CXX_STANDARD 17)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
# 自动调用 MOC、UIC、RCC
set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTOUIC ON)
set(CMAKE_AUTORCC ON)
# 查找所需的 Qt 组件
# 这里的 Core Gui Widgets 是你的项目所依赖的 Qt 模块
find_package(Qt6 REQUIRED COMPONENTS Core Gui Widgets)
# 如果你的 Qt 安装在非标准路径,可能需要手动设置 Qt6_DIR
# set(Qt6_DIR "C:/Qt/6.7.0/msvc2019_64/lib/cmake/Qt6")
# 添加可执行文件目标
add_executable(${PROJECT_NAME}
    main.cpp
    MainWindow.h
    MainWindow.cpp
    # MainWindow.ui  # 如果启用了 AUTOUIC,通常不需要直接添加 .ui 文件
    # resources.qrc  # 如果启用了 AUTORCC,通常不需要直接添加 .qrc 文件
)
# 将找到的 Qt 库链接到你的可执行文件
target_link_libraries(${PROJECT_NAME} PRIVATE
    Qt6::Core
    Qt6::Gui
    Qt6::Widgets
)
# 在 Windows 上,如果是 GUI 应用程序(非控制台),添加以下代码
if (WIN32)
    win32_gui_executable(${PROJECT_NAME})
endif()

3. 编写简单的源代码

main.cpp

#include <QApplication>
#include "MainWindow.h"
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();
    return a.exec();
}

MainWindow.h

#pragma once
#include <QMainWindow>
class MainWindow : public QMainWindow
{
    Q_OBJECT // 必须的宏,用于支持 Qt 的信号/槽机制
public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
};

MainWindow.cpp

#include "MainWindow.h"
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    // 设置窗口标题和大小
    setWindowTitle("My First Qt App in VSCode");
    resize(800, 600);
}
MainWindow::~MainWindow() {}

第四部分:在 VSCode 中构建和运行

  1. 打开项目文件夹: 用 VSCode 打开 my_qt_app 文件夹。
  2. 选择 Kit: 点击底部状态栏的 “No Kit Selected”,从列表中选择你之前配置好的 Kit (如 Qt-6.7.0-MSVC2019_64)。
  3. 选择 Variant (构建类型): 点击底部状态栏的 “[Debug]”,可以选择 Debug, Release, RelWithDebInfo等。
  4. 配置项目 (Configure):
    • 按下 Ctrl+Shift+P 打开命令面板。
    • 输入 CMake: Configure 并执行。或者点击底部状态栏的 “Configure” 按钮。
    • 这会让 CMake 读取你的 CMakeLists.txt,检查依赖,并在项目根目录生成一个 build 文件夹(默认)和 CMakeCache.txt
  5. 构建项目 (Build):
    • 按下 Ctrl+Shift+P,输入 CMake: Build 并执行。或者点击底部状态栏的 “Build” 按钮 (一个小齿轮)。
    • 编译输出会显示在终端中。成功后,可在 build/Debugbuild/Release 文件夹中找到生成的 .exe 文件。
  6. 运行项目 (Run):
    • 按下 Ctrl+Shift+P,输入 CMake: Run Without Debugging。或者点击底部状态栏的 “Play” 按钮。
    • 你的 Qt 应用程序就会启动!
  7. 调试 (Debug):
    • 首先在代码中设置断点 (点击行号左侧)。
    • 然后点击底部状态栏的 “Debug” 按钮 (一个带虫子的播放按钮) 或按 F5
    • VSCode 会启动程序并在断点处暂停,你可以查看变量、调用堆栈等信息。

第五部分:常见问题与技巧 (FAQ)

总结

VSCode + Qt + CMake 的组合提供了高度可定制化和现代化的开发体验。虽然初始配置比 Qt Creator 稍显复杂,但它提供了无与伦比的编辑器体验、强大的扩展生态系统和对构建流程的更深层次控制。一旦配置完成,其流畅的开发体验会让你觉得物有所值。

这套组合是当前 Qt C++ 开发的主流选择之一,它结合了:

到此这篇关于VSCode+Qt+CMake详细地讲解的文章就介绍到这了,更多相关VSCode Qt CMake内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文