Download and Install Emscripten
- My preferred installation location is
- Get the latest sdk:
git clone https://github.com/emscripten-core/emsdk.git
- Enter the cloned directory:
- Install the lastest sdk tools:
./emsdk install latest
- Activate the latest sdk tools:
./emsdk activate latest
- Activate path variables:
- Configure emsdk in your bash profile by running:
echo 'source "/home/user/emsdk/emsdk_env.sh"' >> $HOME/.bash_profile
Your project structure
build/ include/ src/ public/ CMakeLists.txt
Build directory starts empty, place header (.h) files inside /include and source (.cpp) files inside /src.
The public folder is where the output files will go, also keep the index.html, images and css here too.
CMakeLists.txt stays the root directory.
In the root directory, set the CMAKE Toolchain file by running:
CMAKE_TOOLCHAIN_FILE=/home/user/emsdk/upstream/emscripten/cmake/Modules/Platform/Emscripten.cmakeEnsure you update your path with the location of your emsdk installation location
Compile to WASM (default)
cd build emcmake cmake .. make
Compile to JS
cd build emcmake cmake .. -DJS_ONLY=ON make
After Editing Files
After Adding/Removing Files
emcmake cmake .. make
If the emsdk directory is moved
From the project root directory run:
Then from the /build directory, run:
emcmake cmake ..
Output .js, .wasm.js and wasm.wasm files will appear in the public directory.
Make sure you web server serves from /public.
The index.html will load a.js if WebAssembly isn't supported by the client browser.
If the error:
fatal error: emscripten.h: No such file or directory or
The program 'emcmake' is currently not installed or
The program 'emconfigure' is currently not installed is seen, check that your CMAKE_TOOLCHAIN_FILE path is correct as this is often the cause. You could also try re-installing by removing the /build directory, and run through emscripten installation again, making sure you run:
source ./emsdk_env.sh at end. Then recreate the /build directory and run
emcmake cmake .. and