Debug Qt Quick applications

You can debug Qt Quick applications that contain both QML and C/C++ code with the QML debugger and the debugger for your operating system. Usually, you use GDB on Linux and macOS or the Visual Studio Windows debugger on Windows.

Note: Debugging requires opening a socket at a TCP port, which presents a security risk. Anyone on the Internet could connect to the application that you are debugging and execute any JavaScript functions. Therefore, you must make sure that the port is properly protected by a firewall.

Debug QML code

To only debug the QML code in an application, it is faster to attach the debugger to a running application using a fixed port number than to have Qt Extension for VS Code first start the application and then attach the QML debugger to it.

To debug only QML code:

  1. Create a launch.json file for the project. For more information, see Debug Qt applications.
  2. Select Add Configuration, and then select the Qt: QML: Attach by port debug configuration.
  3. In the Terminal, start the application with the following arguments:
    <your_executable_path> -qmljsdebugger=host:<IP_address>,port:<port_number>,block,services:DebugMessages,QmlDebugger,V8Debugger,QmlInspector

    Where IP_address is the IP address of the host where the application is running, port_number is the debugging port, and block prevents the application from running until the debug client connects to the server. This enables debugging from the start.

  4. Set the port number as the value of the port option in the launch.json file:
    "configurations": [
        {
            "name": "Qt: QML: Attach by port",
            "type": "qml",
            "request": "attach",
            "host": "localhost",
            "port": "<port_number>"
        },

Debug mixed C/C++ and QML code

You can create a debug configuration that first starts an application and then attaches both the QML and C/C++ debugger to it using a port number that the Qt: Acquire Port pre-launch task acquires.

To debug a Qt Quick application that contains both C/C++ and QML code:

  1. Open a launch.json file. For more information, see Debug Qt applications.
  2. Select Add Configuration, and then select the Qt: Debug with cppdbg and QML debugger or Qt: Debug with cppvsdbg and QML debugger (Windows) debug configuration that matches your debugger.
  3. Add a compound launch and pre-launch task for C++/QML debugging to the launch.json file:
    "compounds": [
            {
                "name": "C++/QML",
                "configurations": ["Qt: Debug with cppdbg and QML debugger", "Qt: QML: Attach by port"],
                "preLaunchTask": "Qt: Acquire Port",
            }
        ]
    "compounds": [
            {
                "name": "C++/QML",
                "configurations": ["Qt: Debug with cppvsdbg and QML debugger (Windows)", "Qt: QML: Attach by port"],
                "preLaunchTask": "Qt: Acquire Port",
            }
        ]

See also Debug Qt applications and VS Code: Debugging.

© 2024 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.