1# Emscripten {#emscripten} 2 3[Emscripten](https://github.com/kripken/emscripten): An LLVM-to-JavaScript Compiler 4 5If you want to work with `emcc`, `emconfigure` and `emmake` as you are used to from Ubuntu and similar distributions, 6 7```console 8nix-shell -p emscripten 9``` 10 11A few things to note: 12 13* `export EMCC_DEBUG=2` is nice for debugging 14* The build artifact cache in `~/.emscripten` sometimes creates issues and needs to be removed from time to time 15 16## Examples {#declarative-usage} 17 18Let's see two different examples from `pkgs/top-level/emscripten-packages.nix`: 19 20* `pkgs.zlib.override` 21* `pkgs.buildEmscriptenPackage` 22 23A special requirement of the `pkgs.buildEmscriptenPackage` is the `doCheck = true`. 24This means each Emscripten package requires that a [`checkPhase`](#ssec-check-phase) is implemented. 25 26* Use `export EMCC_DEBUG=2` from within a phase to get more detailed debug output what is going wrong. 27* The cache at `~/.emscripten` requires to set `HOME=$TMPDIR` in individual phases. 28 This makes compilation slower but also more deterministic. 29 30::: {.example #usage-1-pkgs.zlib.override} 31 32# Using `pkgs.zlib.override {}` 33 34This example uses `zlib` from Nixpkgs, but instead of compiling **C** to **ELF** it compiles **C** to **JavaScript** since we were using `pkgs.zlib.override` and changed `stdenv` to `pkgs.emscriptenStdenv`. 35 36A few adaptions and hacks were put in place to make it work. 37One advantage is that when `pkgs.zlib` is updated, it will automatically update this package as well. 38 39 40```nix 41(pkgs.zlib.override { 42 stdenv = pkgs.emscriptenStdenv; 43}).overrideAttrs 44(old: rec { 45 buildInputs = old.buildInputs ++ [ pkg-config ]; 46 # we need to reset this setting! 47 env = (old.env or { }) // { NIX_CFLAGS_COMPILE = ""; }; 48 configurePhase = '' 49 # FIXME: Some tests require writing at $HOME 50 HOME=$TMPDIR 51 runHook preConfigure 52 53 #export EMCC_DEBUG=2 54 emconfigure ./configure --prefix=$out --shared 55 56 runHook postConfigure 57 ''; 58 dontStrip = true; 59 outputs = [ "out" ]; 60 buildPhase = '' 61 emmake make 62 ''; 63 installPhase = '' 64 emmake make install 65 ''; 66 checkPhase = '' 67 echo "================= testing zlib using node =================" 68 69 echo "Compiling a custom test" 70 set -x 71 emcc -O2 -s EMULATE_FUNCTION_POINTER_CASTS=1 test/example.c -DZ_SOLO \ 72 libz.so.${old.version} -I . -o example.js 73 74 echo "Using node to execute the test" 75 ${pkgs.nodejs}/bin/node ./example.js 76 77 set +x 78 if [ $? -ne 0 ]; then 79 echo "test failed for some reason" 80 exit 1; 81 else 82 echo "it seems to work! very good." 83 fi 84 echo "================= /testing zlib using node =================" 85 ''; 86 87 postPatch = pkgs.lib.optionalString pkgs.stdenv.isDarwin '' 88 substituteInPlace configure \ 89 --replace-fail '/usr/bin/libtool' 'ar' \ 90 --replace-fail 'AR="libtool"' 'AR="ar"' \ 91 --replace-fail 'ARFLAGS="-o"' 'ARFLAGS="-r"' 92 ''; 93}) 94``` 95 96:::{.example #usage-2-pkgs.buildemscriptenpackage} 97 98# Using `pkgs.buildEmscriptenPackage {}` 99 100This `xmlmirror` example features an Emscripten package that is defined completely from this context and no `pkgs.zlib.override` is used. 101 102```nix 103pkgs.buildEmscriptenPackage rec { 104 name = "xmlmirror"; 105 106 buildInputs = [ pkg-config autoconf automake libtool gnumake libxml2 nodejs openjdk json_c ]; 107 nativeBuildInputs = [ pkg-config zlib ]; 108 109 src = pkgs.fetchgit { 110 url = "https://gitlab.com/odfplugfest/xmlmirror.git"; 111 rev = "4fd7e86f7c9526b8f4c1733e5c8b45175860a8fd"; 112 hash = "sha256-i+QgY+5PYVg5pwhzcDnkfXAznBg3e8sWH2jZtixuWsk="; 113 }; 114 115 configurePhase = '' 116 rm -f fastXmlLint.js* 117 # a fix for ERROR:root:For asm.js, TOTAL_MEMORY must be a multiple of 16MB, was 234217728 118 # https://gitlab.com/odfplugfest/xmlmirror/issues/8 119 sed -e "s/TOTAL_MEMORY=234217728/TOTAL_MEMORY=268435456/g" -i Makefile.emEnv 120 # https://github.com/kripken/emscripten/issues/6344 121 # https://gitlab.com/odfplugfest/xmlmirror/issues/9 122 sed -e "s/\$(JSONC_LDFLAGS) \$(ZLIB_LDFLAGS) \$(LIBXML20_LDFLAGS)/\$(JSONC_LDFLAGS) \$(LIBXML20_LDFLAGS) \$(ZLIB_LDFLAGS) /g" -i Makefile.emEnv 123 # https://gitlab.com/odfplugfest/xmlmirror/issues/11 124 sed -e "s/-o fastXmlLint.js/-s EXTRA_EXPORTED_RUNTIME_METHODS='[\"ccall\", \"cwrap\"]' -o fastXmlLint.js/g" -i Makefile.emEnv 125 ''; 126 127 buildPhase = '' 128 HOME=$TMPDIR 129 make -f Makefile.emEnv 130 ''; 131 132 outputs = [ "out" "doc" ]; 133 134 installPhase = '' 135 mkdir -p $out/share 136 mkdir -p $doc/share/${name} 137 138 cp Demo* $out/share 139 cp -R codemirror-5.12 $out/share 140 cp fastXmlLint.js* $out/share 141 cp *.xsd $out/share 142 cp *.js $out/share 143 cp *.xhtml $out/share 144 cp *.html $out/share 145 cp *.json $out/share 146 cp *.rng $out/share 147 cp README.md $doc/share/${name} 148 ''; 149 checkPhase = '' 150 151 ''; 152} 153``` 154 155::: 156 157## Debugging {#declarative-debugging} 158 159Use `nix-shell -I nixpkgs=/some/dir/nixpkgs -A emscriptenPackages.libz` and from there you can go trough the individual steps. This makes it easy to build a good `unit test` or list the files of the project. 160 1611. `nix-shell -I nixpkgs=/some/dir/nixpkgs -A emscriptenPackages.libz` 1622. `cd /tmp/` 1633. `unpackPhase` 1644. cd libz-1.2.3 1655. `configurePhase` 1666. `buildPhase` 1677. ... happy hacking...