Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. Qt for WebAssembly
  4. Qt 6.2.1 CMake build generates app.js and app.wasm files for my project, but not the expected app.html and qtloader.js. What am I doing wrong?
Forum Updated to NodeBB v4.3 + New Features

Qt 6.2.1 CMake build generates app.js and app.wasm files for my project, but not the expected app.html and qtloader.js. What am I doing wrong?

Scheduled Pinned Locked Moved Unsolved Qt for WebAssembly
6 Posts 3 Posters 1.1k Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • timdayT Offline
    timdayT Offline
    timday
    wrote on last edited by
    #1

    I've had Qt wasm projects working nicely in the past with Qt5 and qmake, but I've now come back to it and wanted to play with Qt 6.2.1 and that meant it was probably time to get on the CMake train too. (Using Qt installed via MaintainanceTool).

    I figured out enough CMake to be able to build a native app (on Debian oldstable amd64). (This is just using commandline and text-editor, not Creator or any IDE). Then tried a wasm build off of the same CMakeList.txt... and while I seemed to get a test.js and test.wasm file ("test" is the project name, rather than "app" used in the examples at https://doc-snapshots.qt.io/qt6-dev/wasm.html ), there was no sign of the expected accompanying test.html and qtloader.js files. Nor did grepping reveal anything obviously relating to those files in the generated Makefiles, so they do not seem to be "targets".

    Any ideas what's supposed to produce them? Does something need adding to the CMakeLists.txt file to get them?

    My CMakeLists.txt is

    cmake_minimum_required(VERSION 3.13)
    
    project(test VERSION 1.0.0 LANGUAGES CXX)
    
    set(CMAKE_CXX_STANDARD 17)
    set(CMAKE_CXX_STANDARD_REQUIRED ON)
    
    set(CMAKE_AUTOMOC ON)
    set(CMAKE_AUTORCC ON)
    set(CMAKE_AUTOUIC ON)
    
    find_package(Qt6 COMPONENTS Core REQUIRED)
    find_package(Qt6 COMPONENTS Quick REQUIRED)
    find_package(Qt6 COMPONENTS Gui REQUIRED)
    find_package(Qt6 COMPONENTS Qml REQUIRED)
    find_package(Qt6 COMPONENTS Svg REQUIRED)
    
    include_directories(
      ${Qt6Core_INCLUDE_DIRS}
      ${Qt6Quick_INCLUDE_DIRS}
      ${Qt6Gui_INCLUDE_DIRS}
      ${Qt6Qml_INCLUDE_DIRS}
      ${Qt6Svg_INCLUDE_DIRS}
      )
    
    add_executable(test
      main.cpp
      resources.qrc
      )
    
    target_compile_options(test PRIVATE -fPIC)
    
    target_link_libraries(test PRIVATE ${Qt6Core_LIBRARIES} ${Qt6Quick_LIBRARIES} ${Qt6Gui_LIBRARIES} ${Qt6Qml_LIBRARIES} ${Qt6Svg_LIBRARIES})
    

    and the commands I'm using to build it are

    source ${HOME}/project/git/emsdk/emsdk_env.sh
    
    export QTDIR=${HOME}/Qt/6.2.1/wasm_32
    export PATH=${QTDIR}/bin/:${PATH}
    export CMAKE_PREFIX_PATH=${QTDIR}/lib/cmake
    ${QTDIR}/bin/qt-cmake -Wno-dev -DQT_FORCE_MIN_CMAKE_VERSION_FOR_USING_QT=3.18 -DCMAKE_BUILD_TYPE:String=Debug -G "Unix Makefiles" .
    

    But that just gets me two of the four files expected.

    App itself is completely minimal... a main.cpp with a QQuickView opening some trivial QML from a qrc file.

    (I'm assuming the information at https://doc-snapshots.qt.io/qt6-dev/wasm.html is still correct and wasm builds haven't moved to some new model where you're supposed to embed the .js in your own HTML).

    (I'd try setting up a qmake build for it next, assuming that's still available in 6.2.1... except it's Qt WS 21 tomorrow to be distracted by.)

    1 Reply Last reply
    0
    • timdayT Offline
      timdayT Offline
      timday
      wrote on last edited by timday
      #2

      Well it (wasm build) works as expected with Qt 6.2 qmake...

      I have a test.pro

      TEMPLATE = app
      
      CONFIG += debug
      CONFIG += qtquickcompiler
      
      QT += core gui quick qml 
      
      TARGET = test
      
      SOURCES += main.cpp
      
      RESOURCES += resources.qrc
      
      cache()
      

      and then the commands

      source ${HOME}/project/git/emsdk/emsdk_env.sh
      
      export QTDIR=${HOME}/Qt/6.2.1/wasm_32
      export PATH=${QTDIR}/bin/:${PATH}
      
      qmake test.pro && make
      

      get me something with the expected index.html and other files that I can run just fine with

      ${HOME}/project/git/emsdk/upstream/emscripten/emrun --browser=firefox test.html
      

      So it seems to be either my CMakeLists.txt needs some extra magic, or CMake and wasm builds have some issue.

      I note that my CMake build outputs a warning

       The minimum required CMake version to use Qt is: '3.21'.  You have
        explicitly chosen to require a lower minimum CMake version: '3.18'.  Using
        Qt with this CMake version is not officially supported.  Use at your own
        risk.
      

      Which I found a bit puzzling as I'd assumed using Qt/6.2.1/wasm_32/bin/qt-cmake was a "bundled" version of cmake and would be "good enough"... but on closer inspection it's just a shim forwarding to the system cmake, which for me is 3.18.4 (from Debian's oldstable-backports). No idea if not using a 3.21+ version could be a contributing factor... at some point soon I'll upgrade to Debian "bullseye" and that has cmake 3.21 in bullseye-backports, so I'll find out then and report back. But for now qmake seems to work.

      1 Reply Last reply
      0
      • lorn.potterL Offline
        lorn.potterL Offline
        lorn.potter
        wrote on last edited by
        #3

        You could always install cmake manually into /opt and then use that version instead.

        Freelance Software Engineer, Platform Maintainer QtWebAssembly, Maintainer QtSensors
        Author, Hands-On Mobile and Embedded Development with Qt 5 http://bit.ly/HandsOnMobileEmbedded

        1 Reply Last reply
        0
        • B Offline
          B Offline
          Babalas
          wrote on last edited by
          #4

          Just noticed the same thing. Switched over to cmake and app.html and qtloader.js aren't being created. I have installed a later cmake so that's not it.

          As an aside you can make your CMakeLists.txt file a little simpler:

          # It'll automatically include requirements so you don't need to list everything. I frequently do just
          # to be explicit
          find_package(Qt6 COMPONENTS Quick Svg REQUIRED)
          
          add_executable(test
            main.cpp
            resources.qrc
            )
          
          target_compile_options(test PRIVATE -fPIC)
          # This will set your includes and libraries for you using cmake library targets
          target_link_libraries(test PRIVATE Qt::Quick Qt::Svg)
          
          1 Reply Last reply
          1
          • B Offline
            B Offline
            Babalas
            wrote on last edited by
            #5

            I don't think cmake support is actually working going on: https://bugreports.qt.io/browse/QTCREATORBUG-24807

            Or there is something extra we need that isn't in the documentation.

            1 Reply Last reply
            0
            • B Offline
              B Offline
              Babalas
              wrote on last edited by
              #6

              Try changing add_executable to qt_add_executable

              1 Reply Last reply
              0

              • Login

              • Login or register to search.
              • First post
                Last post
              0
              • Categories
              • Recent
              • Tags
              • Popular
              • Users
              • Groups
              • Search
              • Get Qt Extensions
              • Unsolved