构建 bgfx Emscripten 应用程序

在这篇文章中,我将描述一种使用 Emscripten 构建 bgfx 网络应用程序 (WebAssembly) 的方法。

安装平台为Linux x86-64,例如Arch Linux。

首先,我们安装Emscripten 3.1.51版本,否则你不会成功,这都是因为最新版本的Emscripten中动态库的类型发生了变化。您可以在这里阅读更多内容:
https://github.com/bkaradzic/bgfx/discussions/3266

这样做是这样的:


git clone https://github.com/emscripten-core/emsdk.git



cd emsdk



./emsdk install 3.1.51



./emsdk activate 3.1.51



source ./emsdk_env.sh



让我们为 WebAssembly 组装 bgfx –脚本:


mkdir bgfx-build-test



cd bgfx-build-test



git clone https://github.com/bkaradzic/bx.git



git clone https://github.com/bkaradzic/bimg.git



git clone https://github.com/bkaradzic/bgfx.git



cd bgfx



emmake make wasm-debug



因此,在 .build 文件夹中,您将拥有扩展名为 .bc 的位码文件,该文件需要与您的 bgfx 应用程序链接。
应该是bgfx.bc、bx.bc、bimg.bc;不同的程序集对这些文件有不同的名称,具体取决于程序集的类型(发布/调试)

添加带有 .bc 文件的 CMakeLists.txt 文件的链接,例如 bgfx-experiments 项目中文件的绝对路径:


target_link_libraries(${PROJECT_NAME} SDL2 GL /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bgfxDebug.bc /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bxDebug.bc /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bimgDebug.bc)



现在将平台数据中的本机窗口句柄更改为 bgfx 初始化:


bgfx::PlatformData platformData{};



platformData.context = NULL;



platformData.backBuffer = NULL;



platformData.backBufferDS = NULL;



platformData.nwh = (void*)"#canvas";



您还需要将渲染类型更改为 OpenGL:


bgfx::Init init;



init.type = bgfx::RendererType::OpenGL;







init.resolution.width = screenWidth;



init.resolution.height = screenHeight;



init.resolution.reset = BGFX_RESET_VSYNC;



init.platformData = platformData;







if (!bgfx::init(init))



{



    throw std::runtime_error("Failed to initialize bgfx");



}



将 GLSL 着色器重新编译为 120:


shaderc -f "VertexShader.vs" -o "VertexShader.glsl" --type "v" -p "120"



shaderc -f "FragmentShader.fs" -o "FragmentShader.glsl" --type "f" -p "120"



是的,但是 .glsl 文件必须作为“预加载文件:”添加到 CMakeLists.txt 中:


set(CMAKE_CXX_FLAGS ... <Остальная часть>



--preload-file VertexShader.glsl \



--preload-file FragmentShader.glsl \



仍然需要通过 emscripten_set_main_loop 使用 while 函数调用替换应用程序中的主渲染循环。

您可以在这里阅读:
https ://demensdeum.com/blog/ru/2017/03/29/porting-sdl-c-game-to-html5-emscripten/

接下来,像往常一样组装您的 Emscripten 项目,一切都应该正常。
有趣– Emscripten 3.1.51 版本似乎缺少 OpenAL(或者只是我)。

使用bgfx和Emscripten正确编译的项目源代码:
https://github.com/demensdeum/ bgfx-experiments/tree/main/2-emscripten-build

来源

https://github.com/bkaradzic/bgfx/discussions/3266
https://bkaradzic.github.io/bgfx/build.html
https://emscripten.org/docs/getting_started/downloads.html
https ://demensdeum.com/blog/ru/2017/03/29/porting-sdl-c-game-to-html5-emscripten/
https://llvm.org/docs/BitCodeFormat.html

Leave a Comment

Your email address will not be published. Required fields are marked *