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...