VS Code 中搭建 Qt 開發(fā)環(huán)境方案分享
前言
VS Code 高大上的界面、強(qiáng)大的智能聯(lián)想和龐大的插件市場，著實讓人對他愛不釋手。雖然可以更改 Qt Creator 的主題，但是 Qt Creator 的代碼體驗實在差勁。下面就來看看如何在 VS Code 中搭建 Qt 開發(fā)環(huán)境。
安裝拓展
工欲善其事，必先利其器。在開干之前，先來安裝一些拓展，他們將提供函數(shù)提示、語法高亮等功能。
C/C++ 拓展
提供智能聯(lián)想功能、語法高亮、Debug 等功能，確實很好用。設(shè)置 "C_Cpp.autocompleteAddParentheses": true，可以把函數(shù)名后面的括號也給補(bǔ)全了。
Qt 拓展
提供在 VS Code 中打開 Qt Designer、預(yù)覽 ui 文件、編譯 ui 文件和 qrc 文件為 python 源代碼、 qss 和 pro 文件語法高亮的功能（之前這兩個拓展評分還都是 5 分，VS Code 更新到 1.57 之后突然變成 0 分了，有點奇怪）。
使用之前，需要去設(shè)置里面配置下 Qt Designer 可執(zhí)行文件的路徑，如果想要編譯 ui 和 qrc 文件為 python 源代碼的話，還需要配置 pyuic.exe 和 pyqrc.exe 的路徑，示例如下：
{
"qtForPython.designer.path": "D:/Qt/6.1.0/mingw81_64/bin/designer.exe",
"pyqt-integration.qtdesigner.path": "D:/Qt/6.1.0/mingw81_64/bin/designer.exe",
"pyqt-integration.pyuic.cmd": "D:/Python38/Scripts/pyuic5.exe",
"qtForPython.rcc.path": "D:/Python38/Scripts/pyrcc5.exe",
"qtForPython.lupdate.path": "D:/Python38/Scripts/pylupdate5.exe",
"qtForPython.rcc.liveExecution": false,
"qtForPython.uic.liveExecution": false
}這些配置都是根據(jù)最新的拓展版本來設(shè)置的，像 Qt for Python 拓展更新之后的那些配置項的鍵就和上個版本不一樣了，所以推薦使用最新版本。配置好之后右擊資源管理器中的 ui 文件，可以在右擊菜單中看到和 Qt 相關(guān)的菜單項，點擊 Edit in Designer 就可以打開 Qt Designer。
創(chuàng)建項目
假設(shè)我們的項目結(jié)構(gòu)如上圖資源管理器中所示（點擊這里下載源代碼和 VSCode 配置文件），下面看下如何在脫離 Qt Creator 的情況下創(chuàng)建一個項目。
創(chuàng)建 pro 文件
在終端輸入 qmake -project 就可以在頂層目錄下生成一個和頂層目錄同名的 pro 文件，在這里為 FirstWidget.pro。寫完代碼之后在終端輸入 qmake，就會在頂層目錄下生成 Makefile、debug 文件夾和 release 文件夾，一下子就讓整個文件夾變得混亂。所以這里我們讓 qmake 生成的文件移到 build 文件夾下，方法是在 pro 文件中加入如下代碼，然后在終端輸入 qmake -o .\build\Makefile：
release: DESTDIR = ./release debug: DESTDIR = ./debug OBJECTS_DIR = $$DESTDIR/.obj MOC_DIR = $$DESTDIR/.moc RCC_DIR = $$DESTDIR/.qrc UI_DIR = $$DESTDIR/.ui
但是每次創(chuàng)建項目都寫上這么一段太麻煩了，這時候 VS Code 的 Snippets 功能就派上用場了。在 VS Code 中 Ctrl + Shift + P -> 首選項：配置用戶代碼片段 -> qmake，將打開的 qmake.json 的內(nèi)容替換為如下代碼，關(guān)于用戶片段的寫法參見 《[VS Code]跟我一起在Visual Studio Code 添加自定義snippet（代碼段），附詳細(xì)配置》：
{
// Place your snippets for qmake here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
"config build dir": {
"prefix": "build",
"body": [
"release: DESTDIR = ./release",
"debug: DESTDIR = ./debug",
"",
"OBJECTS_DIR = $$$DESTDIR/.obj",
"MOC_DIR = $$$DESTDIR/.moc",
"RCC_DIR = $$$DESTDIR/.qrc",
"UI_DIR = $$$DESTDIR/.ui"
],
"description": "配置輸出文件路徑"
},
"initialize project": {
"prefix": "init",
"body": [
"QT += core gui",
"",
"greaterThan(QT_MAJOR_VERSION, 4): QT += widgets",
"",
"CONFIG += c++11",
"",
"# You can make your code fail to compile if it uses deprecated APIs.",
"# In order to do so, uncomment the following line.",
"#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0",
"",
"INCLUDEPATH += ${1:include}",
"",
"SOURCES += \\",
" ${2:src/main.cpp} \\",
" ${3:src/$WORKSPACE_NAME.cpp}",
"",
"HEADERS += \\",
" ${1:include}/$WORKSPACE_NAME.h",
"",
"FORMS += \\",
" $WORKSPACE_NAME.ui",
"",
"release: DESTDIR = ./release",
"debug: DESTDIR = ./debug",
"",
"OBJECTS_DIR = \\$\\$DESTDIR/.obj",
"MOC_DIR = \\$\\$DESTDIR/.moc",
"RCC_DIR = \\$\\$DESTDIR/.qrc",
"UI_DIR = \\$\\$DESTDIR/.ui",
"",
"# Default rules for deployment.",
"qnx: target.path = /tmp/\\$\\$TARGET/bin",
"else: unix:!android: target.path = /opt/\\$\\$TARGET/bin",
"!isEmpty(target.path): INSTALLS += target",
"$0"
],
"description": "初始化工程文件"
},
}使用起來如下所示，真的太香了：
創(chuàng)建 tasks.json
在 VS Code 中按下 Ctrl + Shift + P，在命令面板中輸入 task，選擇配置任務(wù)，具體操作如下：
將 tasks.json 的內(nèi)容替換成如下代碼：
{
"tasks": [
{
"type": "shell",
"label": "qmake build makefile (debug)",
"command": "qmake",
"args": [
"-o",
"./build/Makefile",
"CONFIG += debug",
"CONFIG += console",
],
"options": {
"cwd": "${workspaceFolder}"
},
"problemMatcher": [],
"group": "build",
"detail": "生成 Makefile (debug)"
},
{
"type": "shell",
"label": "qmake build makefile (release)",
"command": "qmake",
"args": [
"-o",
"./build/Makefile"
],
"options": {
"cwd": "${workspaceFolder}"
},
"problemMatcher": [],
"group": "build",
"detail": "生成 Makefile (release)"
},
{
"type": "shell",
"label": "Qt build debug",
"command": "make",
"args": [
"debug"
],
"options": {
"cwd": "${workspaceFolder}/build"
},
"problemMatcher": [],
"group": "build",
"detail": "Qt 生成可調(diào)試文件",
"dependsOn": [
"qmake build makefile (debug)"
]
},
{
"type": "shell",
"label": "Qt build release",
"command": "make",
"args": [
"release"
],
"options": {
"cwd": "${workspaceFolder}/build"
},
"problemMatcher": [],
"group": "build",
"detail": "Qt 生成可執(zhí)行文件",
"dependsOn": [
"qmake build makefile (release)"
]
},
{
"type": "shell",
"label": "Qt build and run release",
"command": "${workspaceFolder}/build/release/${workspaceRootFolderName}.exe",
"args": [],
"problemMatcher": [],
"group": "build",
"detail": "Qt 生成并運(yùn)行可執(zhí)行文件",
"dependsOn": [
"Qt build release"
],
// close 鍵在 VS Code 1.57 引入
"presentation": {
"close": true
}
},
{
"type": "shell",
"label": "Qt build and run debug",
"command": "${workspaceFolder}/build/debug/${workspaceRootFolderName}.exe",
"args": [],
"problemMatcher": [],
"group": "build",
"detail": "Qt 生成并運(yùn)行可調(diào)試文件",
"dependsOn": [
"Qt build debug"
]
},
],
"version": "2.0.0"
}tasks.json 是 VS Code 的一大亮點，可以在里面配置多個任務(wù)，每個任務(wù)其實就是幫你在終端輸入指令。雖然每個任務(wù)的 command 鍵只能輸入一條指令，但是你可以配合 dependsOn 的值，這樣在輸入這個 command 之前就會依次輸入 dependsOn 中各個任務(wù)的 command，相當(dāng)于一個任務(wù)在終端輸入了多條指令。如果知道 Qt Creator 的編譯過程的話就很容易看懂上面 tasks.json 中的每條指令在干些什么。
比如現(xiàn)在我想要在 build 目錄下生成 Makefile，那么只要 Alt + T + R，在任務(wù)菜單中選擇 qmake build makefile (release) 任務(wù)，具體過程如下：
再比如我們現(xiàn)在想要編譯生成 exe 并運(yùn)行之，那么只要選擇 Qt build and run release，具體過程如下：
運(yùn)行任務(wù)之后就可以在 ./build/release 目錄下看到可執(zhí)行文件。如果編譯 makefile 的時候報錯很有可能是因為你沒有把 D:\Qt\6.2.1\mingw81_64\bin（這個是我的 Qt6.2.1 MinGW 套件目錄） 添加到環(huán)境變量里，這個路徑最好放的前面一點，如果電腦里面裝了 Anaconda 還配置了 Anaconda 的路徑的話 qmake 可能會發(fā)生沖突然后報錯。
配置 C++ 智能聯(lián)想
要想讓 C/C++ 拓展解析 Qt 源文件，提供智能聯(lián)想功能，就需要告訴他 Qt 的源文件在哪。只要打開了C/C++文件，就能在 VS Code 的狀態(tài)欄看到 C/C++ 的配置按鈕，我這里的配置按鈕的文字是 Win32，因為我選了 Win32 配置集。下面看下怎么配置智能聯(lián)想功能：
如動圖中所示，我們只要在包含路徑中填入需要解析的 Qt 源文件所在的文件夾即可，一種偷懶的方法是直接填入 D:/Qt/6.1.0/mingw81_64/include/** (這是我的 Qt 路徑)，但是這樣會讓 C/C++ 拓展遞歸解析 include 文件夾下的所有文件，會很慢，所以只需填入要用的那些頭文件所在文件夾即可，比如：
D:/Qt/6.1.0/mingw81_64/include D:/Qt/6.1.0/mingw81_64/include/QtGui D:/Qt/6.1.0/mingw81_64/include/QtCore D:/Qt/6.1.0/mingw81_64/include/QtWidgets
填好之后會在 .vscode 文件夾下面看到一個 c_cpp_properties.json，里面記錄了用戶的配置，之后就可以直接修改這個文件中的鍵的值來配置拓展。配置好之后就可以看到語法高亮和函數(shù)提示了，比如下圖所示：
后記
至此在 VS Code 中搭建 Qt 開發(fā)環(huán)境的步驟全部介紹完畢了，但是 VS Code 的強(qiáng)大之處不止如此，可以在官網(wǎng)的文檔和每個月的發(fā)行文檔中了解更多正確的打開方式，而且VS Code 每個月都會更新，帶來更多好用的特性，趕緊用起來吧！以上~~
到此這篇關(guān)于VS Code 中搭建 Qt 開發(fā)環(huán)境方案分享的文章就介紹到這了,更多相關(guān) VS Code 中搭建 Qt 開發(fā)環(huán)境內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
什么是 PID?它是一種在編程中使用的基本方法,如果正確調(diào)整，可以令人難以置信的有效和準(zhǔn)確,PID代表比例積分微分，3個單獨的部分連接在一起，雖然有時你不需要三個都使用。例如，您可以改為有P控制，PI控制或PD控制2021-06-06
C語言從txt文件中逐行讀入數(shù)據(jù)存到數(shù)組中的實現(xiàn)方法
下面小編就為大家?guī)硪黄狢語言從txt文件中逐行讀入數(shù)據(jù)存到數(shù)組中的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
C語言進(jìn)階輸入輸出重定向與fopen函數(shù)使用示例詳解
這篇文章主要為大家介紹了C語言進(jìn)階輸入輸出重定向與fopen函數(shù)的示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步2022-02-02
這篇文章主要給大家介紹了關(guān)于C++11基于范圍的for循環(huán)的相關(guān)資料,范圍for循環(huán)(也稱為C++11的基于范圍的for循環(huán))是一種簡化迭代容器（如數(shù)組、向量、列表等）元素的方式,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-06-06
C++學(xué)習(xí)小結(jié)之二進(jìn)制轉(zhuǎn)換
這篇文章主要介紹了C++學(xué)習(xí)小結(jié)之二進(jìn)制轉(zhuǎn)換的相關(guān)資料,需要的朋友可以參考下2015-07-07
goto語句也被稱為無條件轉(zhuǎn)移語句，這篇文章主要介紹了C++跳轉(zhuǎn)語句之Goto對變量定義的影響，文中通過示例代碼解文字介紹的很詳細(xì)，相信對大家的理解和學(xué)習(xí)具有一定的參考借鑒價值，有需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2016-11-11
C語言詳解鏈?zhǔn)疥犃信c循環(huán)隊列的實現(xiàn)
隊列（Queue）與棧一樣，是一種線性存儲結(jié)構(gòu)，它具有如下特點：隊列中的數(shù)據(jù)元素遵循“先進(jìn)先出”（First In First Out）的原則，簡稱FIFO結(jié)構(gòu)。在隊尾添加元素，在隊頭刪除元素，本篇來講解鏈?zhǔn)疥犃信c循環(huán)隊列的實現(xiàn)2022-04-04
Visual?studio2022?利用glfw+glad配置OpenGL環(huán)境的詳細(xì)過程
這篇文章主要介紹了Visual?studio2022?利用glfw+glad配置OpenGL環(huán)境,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-10-10
基于C++的農(nóng)夫過河問題算法設(shè)計與實現(xiàn)方法
這篇文章主要介紹了基于C++的農(nóng)夫過河問題算法設(shè)計與實現(xiàn)方法,簡單描述了農(nóng)夫過河問題,并結(jié)合實例形式詳細(xì)分析了基于C++實現(xiàn)農(nóng)夫過河問題的相關(guān)算法實現(xiàn)步驟與操作技巧,需要的朋友可以參考下2017-09-09
對于多線程來說，這兩個概念有很大部分是重疊的。對于很多人來說，它們的意思沒有什么區(qū)別。其區(qū)別主要在于關(guān)注點和意圖方面(差距甚微)。這兩個詞都是用來對硬件在同時執(zhí)行多個任務(wù)的方式進(jìn)行描述的術(shù)語，不過并行更加注重性能2023-02-02