QtCreator上自带WebAssembly环境

勾选安装WebAssembly即可使用，如果想使用最新版的可看下面相关操作。

自己搭建emsdk最新版本在QtCreator上的WebAssembly环境

1. 安装emscripten编译器

使用对应版本编译：github官网源码
以最新版本为例子下载或git clone源码，执行如下命令：需要了解更详细的步骤可查看仓库相关文档。

emsdk install latest //安装最新版emsdk
emsdk activate latest //激活
emsdk_env.bat  //临时环境变量提供运行环境
em++ --version //查看安装版本

2. 安装Qt并编译Qt源码

Qt5.15.2需要通过在线安装器的方式才可以安装。
官方：http://download.qt.io/official_releases/online_installers/
中国科学技术大学：http://mirrors.ustc.edu.cn/qtproject/
清华大学：https://mirrors.tuna.tsinghua.edu.cn/qt/
中国互联网络信息中心：https://mirrors.cnnic.cn/qt/

必须安装WebAssembly，Sources，mingw编译器，其他可自行勾选。

cd /d F:/Qt5.15.2/5.15.2/Src //可以先备份Qt源码
F:\emsdk\emsdk_env.bat //配置emscripten临时环境变量
set PATH=F:\Qt5.15.2\5.15.2\mingw81_64\bin;F:\Qt5.15.2\Tools\mingw810_64\bin;%PATH%
configure -no-warnings-are-errors -xplatform wasm-emscripten -platform win32-g++ -nomake examples -feature-thread -prefix F:/Qt5.15.2/5.15.2/wasm //指定编译平台和安装目录，支持多线程
F:\Qt5.15.2\Tools\mingw810_64\bin\mingw32-make.exe –j4      //编译qt源代码
F:\Qt5.15.2\Tools\mingw810_64\bin\mingw32-make.exe install

3. 命令行cmd中编译项目

设置webassembly临时环境，用之前编译出来的emscripten编译器qmake构建项目，路径为F:\Qt5.15.2\5.15.2\wasm。最后用mingw编译。

cd /d E:\webassembly
F:\emsdk\emsdk_env.bat
F:\Qt5.15.2\5.15.2\wasm\bin\qmake test.pro
F:\Qt5.15.2\Tools\mingw810_64\bin\mingw32-make.exe -j4

4. QtCreator中编译

QtCreator配置emscripten编译器源码位置，如图：
配置自己的webassembly构建套件，如图：

其他

参考教程：
https://github.com/3dgen/cppwasm-book/blob/master/zh/README.md
可以让c++ 运次在网页中

WebAssembly是新一代的Web虚拟机标准，C/C++程序可以通过Emscripten工具链编译为WebAssembly二进制格式.wasm，进而导入网页中供JavaScript调用——这意味着使用C/C++编写的程序将可以直接运行在网页中。

参考资料

Qt官网: https://doc.qt.io/qt-5/wasm.html
emsdk源码：https://github.com/emscripten-core/emsdk.git

win10Qt搭建WebAssembly环境相关推荐

搭建webassembly网页播放器(二)---emcc环境搭建
emcc全称 emscripten,最重要的功能就是让网页js调用c/c++ 成为可能,是我们基于webassembly搭建网页播放器必须依赖的编译工具. emcc官网的搭建教程较为简单,安装过程中最 ...
Qt for WebAssembly 环境搭建 - Windows篇
Qt for WebAssembly 环境搭建概要首先,放两个链接: Qt for WebAssembly 官方文档 Emscripten官网这次搭建Qt for WebAssembly环境,主 ...
搭建webassembly网页播放器(五)---网页播放器开发
在前面的章节中,我们解决emcc环境以及使用emcc来编译ffmpeg得到网页开发中可以使用的js库,本章节,我们就来实现一个简单的播放器. 视频课程以及源码下载: https://edu.csdn. ...
搭建webassembly网页播放器(六)---websocket后台服务程序
这里我们主要介绍后台搭建技术,前端搭建好后,需要后端配置展现,实现的效果就是 :网页连接上我们的 websocket服务后,我们就从H264文件中不断的提取出H264帧,然后传递给前端,前端调用web ...
搭建webassembly网页播放器(三)---emcc编译ffmpeg编译库
经过前面的2个部分,我们完成了环境的搭建,接下来我们使用emcc编译ffmpeg库,注意同样由于软链接的缘故,我们不能在windows和linux的共享文件夹里使用emcc编译ffmpeg, 这里我们 ...
atom搭建markdown环境
1. 搭建markdown环境 > 禁用atom自带的markdown-preview插件(功能简单) > 安装插件:markdown-preview-plus@2.4.16(在markd ...
linux apache2.4 php,php5.6+apache2.4+linux如何搭建php环境
php5.6+apache2.4+linux如何搭建php环境前言最近突然想搭建个人博客,尽管笔者擅长java-web,但综合各种原因,于是选择了大众化的php+mysql搭建个人博客.对于php ...
Android NDK开发之旅29 云服务器Ubuntu下搭建NDK环境，并编译FFmpeg
###前言因为在Linux环境下编译FFmpeg生成库和头文件下比较方便,所以接下来主要操作在Linux环境下进行.但是对于Android NDK 开发新手来说,自己电脑配置Ubuntu Linux ...
软件测试培训：如何搭建测试环境
如何搭建测试环境?这是很多测试人员都需要了解的,测试是每个产品上线前必备的一个检验,不管是什么产品,做好有效的测试是对产品质量的一个负责,软件测试环境要考虑的就是软件在什么软硬件下能正常运行,什么环境 ...

win10Qt搭建WebAssembly环境

文章目录