First, let’s create a new directory to house our project.
Let’s write some code! Populate hello.cxx with our Hello World program:
Next, provide a CMake build configuration at CMakeLists.txt:
We use the
add_executable command to build executables with itk-wasm. The Emscripten and WASI toolchains along with itk-wasm build and execution configurations are contained in the itk-wasm dockcross Docker images used by the itk-wasm command line interface (CLI). Note that the same code can also be built and tested with native operating system toolchains. This is useful for development and debugging.
Build the program with the itk-wasm CLI,
itk-wasm. This is shipped with the
itk-wasm Node.js package. First install itk-wasm with the Node Package Manager,
npm, the CLI that ships with Node.js.
npm install --global itk-wasm
Build the project with the WASI
itkwasm/wasi toolchain in the
itk-wasm -i itkwasm/wasi -b ./wasi-build/ build
hello.wasi.wasm WebAssembly binary is built in the
❯ ls wasi-build
Execute the binary with the
❯ itk-wasm -b ./wasi-build/ run hello.wasi.wasm
Congratulations! You just executed a C++ program compiled to WebAssembly. 🎉
The binary can also be executed with any of the available WASI runtimes.
For Node.js or the Browser, build the project with the default Emscripten toolchain. The project is built in the
./web-build directory by default.
To execute the project, create an
import path from 'path'
And run it!
❯ npx node ./index.mjs
The same Emscripten WebAssembly module can be executed in a web browser.
its output in the HTML DOM:
Serve the with an http server:
npm install --global http-server
And point your browser to
Congratulations! You just executed a C++ program in your web browser. 🎉