A Qt Template Project for VsCode,which allows you to develop QT through VsCode !
git clone [email protected]:EA-LGX/DemoForVsCode.git
-
Rename the
Project Folder
-
Rename the file
DemoForVsCode.pro
🥸Notice: The name of
project's folder
should be the same asxxx.pro
! ! !
-
Open this Project by VsCode
-
Specify your
GDB
path in launch.json at line 15 , such as:15 "miDebuggerPath": "D:\\Qt\\Qt5.12.11\\Tools\\mingw730_64\\bin\\gdb"
-
Edit the
includePath
in c_cpp_properties.json at line 7 , such as:7 "D:\\Qt\\Qt5.12.11\\5.12.11\\mingw73_64\\include\\**"
🥸Pay attention: Don't forget appen
**
to you path -
Edit tasks.json file
Specify
qmake
command at line 9 , such as:9 "command": "D:\\Qt\\Qt5.12.11\\5.12.11\\mingw73_64\\bin\\qmake"
Specify
mingw32-make
command at line 24 ,40 ,52 . such as:24 "command": "D:\\Qt\\Qt5.12.11\\Tools\\mingw730_64\\bin\\mingw32-make" 40 "command": "D:\\Qt\\Qt5.12.11\\Tools\\mingw730_64\\bin\\mingw32-make" 52 "command": "D:\\Qt\\Qt5.12.11\\Tools\\mingw730_64\\bin\\mingw32-make"
Specify
qtcreator
command at line 77 , such as:77 "command": "D:\\Qt\\Qt5.12.11\\Tools\\QtCreator\\bin\\qtcreator.exe"
Specify
windeployqt
command at line 88 , such as:88 "command": "D:\\Qt\\Qt5.12.11\\5.12.11\\mingw73_64\\bin\\windeployqt"
Specify
designer
command at line 103 , such as:103 "command": "D:\\Qt\\Qt5.12.11\\5.12.11\\mingw73_64\\bin\\designer"
Configured Done ! Congratulate ! ! ! 🎉
Task | Explain | Equivalent command | Usage |
---|---|---|---|
QT_Qmake | Generate Makefile from .pro files | qmake xxx.pro | Just run |
QT_BuildDebug | Generate Debug executable file according to Makefile | make debug | Just run |
QT_BuildRelease | Generate Release executable file according to Makefile | make release | Just run |
QT_Clean | Clean the output file | make clean | Just run |
QT_Run | Run the executable file | Just run | |
QT_OpenWithQtCreator | Open the .pro file with QtCreator | Just run | |
QT_Deploy | Deploy,which copy the runtime files(such *.dll) to folder | windeployqt xxx.exe | Just run |
QT_Designer | Open the .ui file with QtDesigner | Select the .ui file,then run task |
🚀Examples && Test:
-
▶️ Run Qt:- Click
Terminal
at Toolbars ,then selectrun tasks
,runQT_Qmake
Task - Click
Terminal
at Toolbars ,then selectrun tasks
,runQT_Run
Task
- Click
-
🪲Debug:
- set a breakpoint ,then click Sidebar and select Debug
The End,And Enjoy😊
如果你想通过自己创建的项目或者在已有的项目中配置,那么下面的内容会教你如何应用到自己的项目当中。
在使用VsCode配置QT程序之前,我们应该需要知道如何通过命令行来编译以及运行QT工程。如果您已经了解如何通过qmake以及mingw32-make命令来编译和运行代码,为节省您的时间,请跳到配置VsCode+QT
下面是我个人常用的方式,可以参考:
-
打开工程目录 (.pro所以位置)
-
在工程目录下进入终端(当然也可以先打开终端,然后cd 到你的工程下)
-
创建一个build文件夹,这样可以避免编译生成的文件散落在工程目录下
-
进入到build文件夹
-
执行
qmake ../XXX.pro
(因为.pro文件是在build文件夹的上一层) -
执行
mingw32-make -j16 debug
-
进入build下的debug文件夹,此时可以看到生成了xxxx.exe可执行文件
-
双击 xxx.exe 运行,自此结束。
PS D:\Desktop> qmake ../Demo.pro qmake : 无法将“qmake”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名 称的拼写,如果包括路径,请确保路径正确,然后再试一次。
如果你遇到了上面情况,请注意检查是否添加下面两条环境变量
如果指定头文件的路径,VsCode就不知道你的代码里面的头文件是在哪里,导致代码报红
这是我QT的mingw64编译套件对应的头文件路径 D:\\Qt\\Qt5.12.11\\5.12.11\\mingw73_64\\include\\**
请根据自己的来修改。
-
在
.vscode
文件夹下创建tasks.json
(如果没有这个目录就自己建一个) -
将下面内容粘贴到tasks.json文件里
{ "tasks": [ // 任务:qmake 根据.pro文件生成 Makefile,通常是.pro文件改动后才需要执行 // 这个任务的执行等效命令行 >> cd build // >> qmake ../Demo.pro { "type": "shell", "label": "qmake", "options": { // cwd的意思是执行这个命令的时候,所在的目录 // 这里我们指定为工程目录下的build文件夹,这样的话 // 当执行qmake的时候,产生的中间文件就在build文件夹下面了 "cwd": "${workspaceFolder}\\build" }, "command": "qmake", //command 命令,这个不用说了 "args": [ // qmake后面跟的参数,因为上面cwd配置为build目录, // 所以.pro文件应该在build的上一级,所以使用../*.pro "../*.pro" ], }, // 任务:编译 每次修改代码后都需要执行 // 任务等效命令行 >>make -j16 debug { "label": "make", "options": { "cwd": "${workspaceFolder}\\build" }, "group": { "kind": "build", "isDefault": true }, "command": "make", "args": [ "-j16", "debug" ], "dependsOn": [ //"qmake" ] }, // 任务:清理 等效命令行 make clean { "label": "clean", "options": { "cwd": "${workspaceFolder}\\build" }, "command": "make", "args": [ "clean" ] }, // 运行程序 { "label": "run", "options": { "cwd": "${workspaceFolder}\\build\\debug" }, "command": "${workspaceFolderBasename}.exe", "args": [ "" ], "dependsOn": [ "make" ] } ], "version": "2.0.0" }
配置tasks.json演示如下:
-
在.vscode文件夹下新建launch.json 并且粘贴下面内容
{ "version": "0.2.0", "configurations": [ { "name": "gdb", "type": "cppdbg", "request": "launch", "program": "${fileDirname}\\build\\debug\\Demo",//程序可执行文件的完整路径。 "args": [], "stopAtEntry": false, "cwd": "${fileDirname}", "environment": [], "externalConsole": false, "MIMode": "gdb", //"miDebuggerPath": "D:\\Qt\\Qt5.12.11\\Tools\\mingw730_64\\bin\\gdb.exe", "setupCommands": [ { "description": "为 gdb 启用整齐打印", "text": "-enable-pretty-printing", "ignoreFailures": true } ], // 调试之前先编译一下,即对应tasks.json任务中的make "preLaunchTask": "make"//与tasks.json文件里的label名对应 } ] }
配置launch.json演示如下: