Building Qt for WebAssembly

build-qt-wasm.sh

# Get dependencies in place (example for Debian based systems)
sudo apt-get build-dep --yes qt5-default
sudo apt-get install --yes libxcb-xinerama0-dev git python cmake default-jre

# Install Emscripten
git clone https://github.com/juj/emsdk.git
cd emsdk
./emsdk install latest
./emsdk activate latest
source emsdk_env.sh
cd ..

# Build Qt
git clone -b 5.12.0 https://code.qt.io/qt/qt5.git
cd qt5
./init-repository -f --module-subset=qtbase,qtdeclarative,qtwebsockets,qtsvg,qtquickcontrols,qtquickcontrols2,qtgraphicaleffects
./configure -opensource -confirm-license -xplatform wasm-emscripten -release -static -no-feature-thread -nomake examples -no-dbus -no-ssl
make
cd ..

# Build your project
git clone https://github.com/msorvig/qt-webassembly-examples.git
cd qt-webassembly-examples/quick_controls2_gallery
../../../qt5/qtbase/bin/qmake
make

# Serve it and browse to http://localhost:8000/gallery.html
python -mSimpleHTTPServer

Hi, this is great instructions.

I'm getting the folowing right after the ./configure..

Note: The following modules are not being compiled in this configuration:
webenginecore
webengine
webenginewidgets
pdf
pdfwidgets

Do you know how to configure webengine to compile with wasm emscripten?

webengine to compile with wasm emscripten

try Qt above 5.13

https://hub.packtpub.com/qt-5-13-releases-with-a-fully-supported-webassembly-module-chromium-73-support-and-more/

hi, thanks for replying.

I forgot to say I was using QT v5.15.2 using emsdk 1.39.8

this is what I wrote:
./init-repository -f --module-subset=qtbase,qtdeclarative,qtwebsockets,qtsvg,qtquickcontrols,qtquickcontrols2,qtgraphicaleffects,qtwebengine

./configure -opensource -confirm-license -xplatform wasm-emscripten -release -static -no-feature-thread -nomake examples -no-dbus -no-ssl

I can't find much information around to explain why webengine can't be compiled with emscripten.

If you happen to know, let me know. Thanks!

@comiquita

I bet C++ code of qtwebengine can not be ported to Emscripten.

C++ code of qtwebengine is chromium + some QT code

porting C++ code of qtwebengine to Emscripten is same as porting C++ code of chromium to run in browser (chromium, firefox, etc.) i.e. nearly impossible

in theory (as a workaround), some qtwebengine APIs may be emulated using javascript in browser

BTW
If you need only rendering part of qtwebengine - i managed to port (almost full) skia based HTML renderer from chromium to Emscripten as hobby project https://github.com/blockspacer/skia-opengl-emscripten/tree/master/docs