在这篇文章中,我将描述一种使用 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