document how to build for WebAssembly

This commit is contained in:
Peter Hartmann 2024-03-15 11:51:32 +01:00 committed by uwerat
parent f6aa7d0c5e
commit 692cfad948
2 changed files with 51 additions and 0 deletions

View File

@ -0,0 +1,51 @@
---
title: 10. Building QSkinny for WebAssembly (Wasm)
layout: docs
---
:doctitle: 10. Building QSkinny for WebAssembly (Wasm)
:notitle:
== 10. Building QSkinny for WebAssembly (Wasm)
=== Build Qt for Wasm
Build Qt for Wasm from source as described here: https://doc.qt.io/qt-6/wasm.html#building-qt-from-source ; The verified Qt version for QSkinny as of this writing was 6.6.0. It might also work to use a downloaded version of Qt for Wasm, but some additional libraries will need to be built.
After configuring Qt as described in the link above, for QSkinny you will need the qtbase, qtdeclarative, qtshadertools and qtsvg modules.
Assuming the Emscripten SDK in `~/dev/emscripten` and Qt in `~/dev/qt5`, Qt can be compiled the following way:
[source]
....
cd ~/dev/qt5
source "~/dev/emsdk/emsdk_env.sh"
cmake --build . -t qtbase -t qtdeclarative -t qtshadertools -t qtsvg
....
This will install all required libs in `~/dev/qt5/qtbase/lib`.
=== Build QSkinny for Wasm
With the Qt version from above QSkinny can be built for WAsm, assuming it has been checked out at `~/dev/qskinny`. Note the configuration option `BUILD_QSKDLL=OFF` for static
builds:
[source]
....
mkdir -p ~/dev/qskinny-wasm-build
source "~/dev/emsdk/emsdk_env.sh"
~/dev/qt5/qtbase/bin/qt-cmake -S ~/dev/qskinny -B ~/dev/qskinny-wasm-build -DBUILD_QSKDLL=OFF
....
=== Run QSkinny for Wasm
Qt creates the HTML wrappers automatically, so there is not much to do except letting Emscripten start the server and open our app in the browser:
[source]
....
/usr/bin/python3 ~/dev/emsdk/upstream/emscripten/emrun.py --browser firefox --port 30001 --no_emrun_detect ~/dev/qskinny-wasm-build/examples/bin/iotdashboard.html
....
.The IOT dashboard example in a browser
image::../images/iotdashboard-wasm.png[The IOT dashboard example in a browser]

Binary file not shown.

After

Width:  |  Height:  |  Size: 109 KiB