Skip to content

Build Qt WebEngine on Windows

Jump to bottom
kaamui edited this page Jan 3, 2024 · 1 revision

Building Qt WebEngine from source

These instructions aim to make easier the building of Qt WebEngine libs (with proprietary codecs) from source. I personally struggled a few days because of a lack of understanding of how some of the programs involved are working, but also because of some errors and poor explanations in the official documentations, that I also found poorly organized.

I thus felt the need to provide a readme to prevent anyone else loosing so much time, and hope this will help some people.

Prepare your environment

Install git bash

Install VS 2019 Community

  1. Download https://visualstudio.microsoft.com/thank-you-downloading-visual-studio/?sku=Community&rel=16
  2. Choose Desktop Development in C++

Install GPerf

Follow this link : https://gnuwin32.sourceforge.net/downlinks/gperf.php

Install Python 2.7

Follow this link : https://www.python.org/ftp/python/2.7.18/python-2.7.18.amd64.msi

Important note : for now, Python 3 is not supported.

Install Bison

Follow this link : http://downloads.sourceforge.net/gnuwin32/bison-2.4.1-setup.exe

Install Flex

Follow this link : https://gnuwin32.sourceforge.net/downlinks/flex.php

Install Qt

go to Qt downloads page and follow the instructions to download the opensource version of Qt

https://www.qt.io/download-open-source
at the bottom of the page, click on the "Download the Qt Online Installer" button
on the next page, Qt chose automatically the version corresponding to your current OS, so be sure it is the version you want to download (for this example, "Qt Online Installer for Windows (64-bit)")
click on the "Download" button

Follow the instructions (for this example, Qt is installed in C:\ and pick the <Qt_version> you want (for example 5.15.0), then select :

  • Desktop 64-bit

For the rest of this tutorial, we suppose Qt is installed at "C:\Qt"

Add qmake to environment variables

  • Add qmake folder to environment variables :

    • search for "Environment Variables" on Windows searchbar, click on it.
    • click on the last button at the bottom of the page, called "environment variables"
    • on the "system variables" window, add the Qt bin folder - where qmake.exe, using msvc 2019, is located - to the Path variable (for example "C:\Qt\5.14.2\msvc2019_64\bin")

  • search for "Developer Command Prompt for VS 2019" on Windwos searchbar, click on it

You can verify that you correctly configured qmake and nmake by respectively taping qmake -v and nmake/? these commands should show something like following :

C:\Program Files (x86)\Microsoft Visual Studio\2019\Community>qmake -v
QMake version x.y
Using Qt version <Qt_version> in <path_to_your_Qt_folder>/<Qt_version>/msvc2019_64/lib

C:\Program Files (x86)\Microsoft Visual Studio\2019\Community>nmake /?
Microsoft (R) Program Maintenance Utility Version 14.26.27034.0
Copyright (C) Microsoft Corporation. Tous droits réservés.

Download Qt WebEngine sources

Clone the repository

Open git bash

git clone https://code.qt.io/cgit/qt/qtwebengine.git
# OR
git clone https://github.com/qt/qtwebengine.git

Choose the branch you want to build

cd qtwebengine
git checkout 5.15.12

Initialize the third party submodules (chromium, gn and ninja)

In the Qt wiki, we can read : "In case you cloned Qt WebEngine as a separate module from git, you might need to initialize out the src/3rdparty submodule that contains the Chromium and Ninja code: cd qtwebengine git submodule update --init". We are in this case, so we do it, but we add --progressoption to have more output (useful when the operation can take an hour !).

cd qtwebengine #skip if already in
git submodule update --init --progress

Configure Qt WebEngine

To pass Qt WebEngine config options to qmake, you have to add -- to mark the end of the qmake options, and then pass your Qt WebEngine arguments. In the following example, we add -proprietary-codecs option to support HTML5 players, Vimeo players, etc.

you can find all the options in the configure.json files located in the different directories of the Qt WebEngine repo. For example : https://github.com/qt/qtwebengine/blob/dev/src/core/configure.json

Launch x64 Native Tools Prompt for VS 2019.

Be Careful ! It won't compile if your not with the x64 prompt. Don't use x86_64 Native Tools Prompt for VS 2019 !

cd qtwebengine #skip if already in
mkdir build
cd build
qmake .. -- -proprietary-codecs

Compile Qt WebEngine

This operation will take several hours even on a good PC.

# To use all the procs
set CL=/MP
nmake

Install Qt WebEngine

Libraries, binaries, mkspecs, etc are moved to the Qt directory you used.

nmake install

That's all ! Well done !

Clone this wiki locally