Developer notes / emscripten
Install emscripten: see https://emscripten.org/docs/getting_started/downloads.html or use external/hello_imgui/hello_imgui/tools/emscripten/install_emscripten.sh
Build imgui_bundle for emscripten
mkdir build_ems
cd build_ems
source ~/emsdk/emsdk_env.sh
emcmake cmake .. -DCMAKE_BUILD_TYPE=Release # This will download a precompiled version of OpenCV4.7.0 for emscripten
make -j
Test:
python -m http.server
Then open http://localhost:8000/bin/ in a browser
How to build the precompiled OpenCV package for emscripten
Docs and tricks, cf:
Clone Opencv 4.7.0
git clone https://github.com/opencv/opencv.git
cd opencv
git checkout 4.7.0
cd ..
Option1: With cmake command extracted from build_js.py:
Build this on a linux machine! Too many issues on macOS.
source ~/emsdk/emsdk_env.sh
mkdir build
cd build
EMSDK=~/emsdk
OPENCV_SRC=$(pwd)/../opencv
OPENCV_INSTALL=$(pwd)/../opencv_emscripten_install
TOOLCHAIN=$EMSDK/upstream/emscripten/cmake/Modules/Platform/Emscripten.cmake
PYTHON_EXE=$(which python3)
Manually edit opencv/CMakeList.txt, and add:
add_compile_options(-pthread)
add_link_options(-pthread)
Note: to compile without pthread support,
* remove -pthread below
* replace *twice* "-s USE_PTHREADS=1" by "-s USE_PTHREADS=0"
cmake \
../opencv \
-DPYTHON_DEFAULT_EXECUTABLE=$PYTHON_EXE \
-DCMAKE_BUILD_TYPE=Release \
-DCMAKE_INSTALL_PREFIX=$OPENCV_INSTALL \
-DCMAKE_TOOLCHAIN_FILE=$TOOLCHAIN \
\
-DCPU_BASELINE='' -DCPU_DISPATCH='' -DENABLE_PIC=FALSE -DCV_TRACE=OFF -DBUILD_SHARED_LIBS=OFF -DWITH_1394=OFF -DWITH_ADE=OFF -DWITH_VTK=OFF -DWITH_EIGEN=OFF -DWITH_FFMPEG=OFF -DWITH_GSTREAMER=OFF -DWITH_GTK=OFF -DWITH_GTK_2_X=OFF -DWITH_IPP=OFF -DWITH_JASPER=OFF -DWITH_JPEG=ON -DWITH_WEBP=OFF -DWITH_OPENEXR=OFF -DWITH_OPENGL=OFF -DWITH_OPENVX=OFF -DWITH_OPENNI=OFF -DWITH_OPENNI2=OFF -DWITH_PNG=ON -DWITH_TBB=OFF -DWITH_TIFF=OFF -DWITH_V4L=OFF -DWITH_OPENCL=OFF -DWITH_OPENCL_SVM=OFF -DWITH_OPENCLAMDFFT=OFF -DWITH_OPENCLAMDBLAS=OFF -DWITH_GPHOTO2=OFF -DWITH_LAPACK=OFF -DWITH_ITT=OFF -DWITH_QUIRC=ON -DBUILD_ZLIB=ON -DBUILD_opencv_apps=OFF -DBUILD_opencv_calib3d=ON -DBUILD_opencv_dnn=ON -DBUILD_opencv_features2d=ON -DBUILD_opencv_flann=ON -DBUILD_opencv_gapi=OFF -DBUILD_opencv_ml=OFF -DBUILD_opencv_photo=ON -DBUILD_opencv_imgcodecs=ON -DBUILD_opencv_shape=OFF -DBUILD_opencv_videoio=OFF -DBUILD_opencv_videostab=OFF -DBUILD_opencv_highgui=OFF -DBUILD_opencv_superres=OFF -DBUILD_opencv_stitching=OFF -DBUILD_opencv_java=OFF -DBUILD_opencv_js=ON -DBUILD_opencv_python2=OFF -DBUILD_opencv_python3=OFF -DBUILD_EXAMPLES=ON -DBUILD_PACKAGE=OFF -DBUILD_TESTS=ON -DBUILD_PERF_TESTS=ON -DBUILD_DOCS=OFF -DWITH_PTHREADS_PF=OFF -DCV_ENABLE_INTRINSICS=OFF -DBUILD_WASM_INTRIN_TESTS=OFF \
\
\"-DCMAKE_C_FLAGS='-pthread -s WASM=1 -s USE_PTHREADS=1 ' \" \"-DCMAKE_CXX_FLAGS='-pthread -s WASM=1 -s USE_PTHREADS=1 ' \"
make -j
make install
Deploy to github
tar cvfz opencv_4.7_pthread_emscripten_install.tgz opencv_emscripten_install
Then upload this to a release archive.
Option 2 (deprecated): Build by hacking opencv/platforms/js/build_js.py
Edit opencv/platforms/js/build_js.py Change the following values inside get_cmake_cmd(): -DBUILD_opencv_imgcodecs=ON -DWITH_PNG=ON -DWITH_JPEG=ON -DCMAKE_INSTALL_PREFIX=…./opencv_install // specify your desired location here
Then run
source ~/emsdk/emsdk_env.sh
python ./opencv/platforms/js/build_js.py build_wasm --build_wasm --emscripten_dir /Users/pascal/emsdk/upstream/emscripten
(This will build opencv lib, but will forget to build opencv_imgcodec.a)
Then run
cd build_wasm/
make -j
make install
⇒ then you can use the install folder (OpenCVConfig.cmake is inside opencv_install/lib/cmake/opencv4/OpenCVConfig.cmake)