"QML module not found" error when importing custom qml module

Simmania

Hi

In Qt Creator I try to make custom modules working.

I created a folder custom_qml with some qml files. The CMakeLists.txt in this folder is this:

set(MODULE_NAME MyButtons)
set(LIB_NAME ${MODULE_NAME}Lib) # MyButtonsLib

qt_add_library(${LIB_NAME} STATIC)

set_target_properties(${LIB_NAME} PROPERTIES AUTOMOC ON)
target_link_libraries(${LIB_NAME} PRIVATE Qt6::Quick)

qt_add_qml_module(${LIB_NAME}
	URI ${MODULE_NAME}
	# VERSION 1.0
	RESOURCE_PREFIX /
	QML_FILES
		RedButton.qml
		GreenButton.qml
)

In my main CMakeLists.txt I added:

add_subdirectory(custom_qml)
target_link_libraries(appstudio
    PRIVATE Qt6::Quick MyButtonsLibplugin
)

The library seems to compile correctly.

But now I want to use it.
When in my Main.qml I add the import line:

import MyButtons

The editor shows and error: QML module not found

Note that I did add to the main function the line:

engine.addImportPath(":/"); // for importing custom qml modules

Some tutorial told me to do that.

So what could be wrong here?

I use Qt 6.11.2
I use Qt Creator 20.0.1

JKSH

@Simmania said in "QML module not found" error when importing custom qml module:

The editor shows and error: QML module not found

That message comes from the old code model, which doesn't fully understand custom QML modules.

Enable the QML Language Server instead: https://doc.qt.io/qtcreator/creator-how-to-use-qml-language-server.html

But, you'll also need to make a few more changes (see below).

Note that I did add to the main function the line:
engine.addImportPath(":/"); // for importing custom qml modules
Some tutorial told me to do that.

That tutorial is outdated. This has not been recommended since Qt 6.5 (see https://www.qt.io/blog/whats-new-for-qml-modules-in-6.5) so please remove this.

Please share the blog post with the author and ask them author to update their tutorial to reflect current best practices.

qt_add_qml_module(${LIB_NAME}
	URI ${MODULE_NAME}
	# VERSION 1.0
	RESOURCE_PREFIX /
	QML_FILES
		RedButton.qml
		GreenButton.qml
)

You've correctly identified that you don't need VERSION. Please also remove RESOURCE_PREFIX / and let it use the default prefix instead, as described in the blog post. Do the same for your main app's QML module.

If your code uses something like engine.load("qrc:/Main.qml"), switch it to engine.loadFromModule("studio", "Main") (assuming that your app's QML module uses URI studio)

In my main CMakeLists.txt I added:

add_subdirectory(custom_qml)
target_link_libraries(appstudio
    PRIVATE Qt6::Quick MyButtonsLibplugin
)

You'll need to set up a few other things. The order below is important:

find_package(Qt6 REQUIRED COMPONENTS Quick)
qt_standard_project_setup(REQUIRES 6.8) # <-- You can use REQUIRES 6.11 if you want

add_subdirectory(custom_qml) # <-- This must be called BEFORE adding your main QML module

# ...

qt_add_qml_module(appstudio
    URI studio
    QML_FILES
        Main.qml
    DEPENDENCIES
        TARGET MyButtonsLib # <-- Now that your custom_qml folder is processed,
                            #     this tells the QML tools where to find your
                            #     custom QML module when processing your app
)

Simmania

@JKSH

Thx a lot.

I think I applied all changes you mentioned. But when opening the project in Qt Qcreator now it does not come alive and gives this error:

[cmake] CMake Error at custom_qml/MyButtons/CMakeLists.txt:4 (set_target_properties):
[cmake]   set_target_properties Can not find target to add properties to:
[cmake]   MyButtonsLib

My main CMakeLists.txt looks like this now:

cmake_minimum_required(VERSION 3.16)

project(studio VERSION 0.1 LANGUAGES CXX)

# Fixes the __cplusplus macro mismatch for MSVC
if(MSVC)
    add_compile_options(/Zc:__cplusplus)
endif()

set(CMAKE_CXX_STANDARD_REQUIRED ON)

#set(QT_QML_OUTPUT_DIRECTORY
#    ${CMAKE_BINARY_DIR}/qml
#)

find_package(Qt6 REQUIRED COMPONENTS Quick)

qt_standard_project_setup(REQUIRES 6.11)

add_subdirectory(custom_qml/MyButtons)

# Content of downloaded design from Figma to Qt or similar
if (EXISTS "${CMAKE_CURRENT_LIST_DIR}/importedcontent/CMakeLists.txt")
    add_subdirectory(${CMAKE_CURRENT_LIST_DIR}/importedcontent)
endif()

qt_add_executable(appstudio
    main.cpp
)

qt_add_qml_module(appstudio
    URI studio
    QML_FILES
        Main.qml
        MButton.qml
	DEPENDENCIES
		TARGET MyButtonsLib
)


# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
# If you are developing for iOS or macOS you should consider setting an
# explicit, fixed bundle identifier manually though.
set_target_properties(appstudio PROPERTIES
#    MACOSX_BUNDLE_GUI_IDENTIFIER com.example.appstudio
    MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
    MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
    MACOSX_BUNDLE TRUE
    WIN32_EXECUTABLE TRUE
)

target_link_libraries(appstudio
	PRIVATE Qt6::Quick MyButtonsLib
)

install(TARGETS appstudio
    BUNDLE DESTINATION .
    LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR}
    RUNTIME DESTINATION ${CMAKE_INSTALL_BINDIR}
)

Note that I'm not sure about

target_link_libraries(appstudio
	PRIVATE Qt6::Quick MyButtonsLib
)

Maybe that should be

target_link_libraries(appstudio
	PRIVATE Qt6::Quick MyButtonsLibplugin
)

But it seems to make no difference.

My lib CMakeLists.txt looks like:

set(MODULE_NAME MyButtons)
set(LIB_NAME ${MODULE_NAME}Lib) # MyButtonsLib

set_target_properties(${LIB_NAME} PROPERTIES AUTOMOC ON)

qt_add_library(${LIB_NAME} STATIC)

qt_add_qml_module(${LIB_NAME}
	URI ${MODULE_NAME}
	# VERSION 1.0
	QML_FILES
	    RedButton.qml
		GreenButton.qml
)

target_link_libraries(${LIB_NAME} PRIVATE Qt6::Quick)

When removing line 4, I get the error message:

[cmake] CMake Error at C:/Qt/6.11.2/msvc2022_64/lib/cmake/Qt6Core/Qt6CoreMacros.cmake:1539 (message):
[cmake]   Metatype generation requires either the use of AUTOMOC or a manual list of
[cmake]   generated json files

So that lines seems needed.
Any idea what is wrong now?

JKSH

@Simmania said in "QML module not found" error when importing custom qml module:

[cmake] CMake Error at custom_qml/MyButtons/CMakeLists.txt:4 (set_target_properties):
[cmake]   set_target_properties Can not find target to add properties to:
[cmake]   MyButtonsLib

You've swapped the order of qt_add_library() and set_target_properties(). The order in your previous version was fine; you must define the target library first before you can set its properties.

When removing line 4, I get the error message:

[cmake] CMake Error at C:/Qt/6.11.2/msvc2022_64/lib/cmake/Qt6Core/Qt6CoreMacros.cmake:1539 (message):
[cmake]   Metatype generation requires either the use of AUTOMOC or a manual list of
[cmake]   generated json files

So that lines seems needed.

You don't need it if you called qt_standard_project_setup() at the start of your project. This automatically enables AUTOMOC on all of your targets (and it also enables other features): https://doc.qt.io/qt-6/qt-standard-project-setup.html#description

Note that I'm not sure about
target_link_libraries(appstudio
	PRIVATE Qt6::Quick MyButtonsLib
)
Maybe that should be
target_link_libraries(appstudio
	PRIVATE Qt6::Quick MyButtonsLibplugin
)
But it seems to make no difference.

For STATIC modules, the official examples use *plugin: https://github.com/qt/qtdoc/blob/v6.11.2/examples/demos/mediaplayer/CMakeLists.txt#L31-L33

(Note: In practice, you could probably omit "MyButtonsLibplugin" and rely on qmlimportscanner to automatically find it... but I like to specify the link for clarity)