WindowsにEmscriptenをインストール(incoming対応 WebAssembly環境の整備)
※ WebAssemblyの出力には、incoming版である必要がないことが分かりましたので、一部修正しました(2017/05/18)。
Emscriptenは、C/C++のコードからJavaScriptを出力することのできる開発環境です。
C/C++で書いたコードをそのままブラウザ上で動かすことができるので、とても便利です。また、asm.jsや、WebAssemblyの出力にも対応しています。また、GLFWやOpenGL ESにも対応しているため、グラフィックアプリケーションもコンパイルすることができます。
この記事では、Windows環境上にEmscriptenのincoming版をインストールするための手順を紹介します。RustからWebAssemblyを出力するためにも必須の環境です。ちなみに、インストール完了までに2時間ほどかかる場合があります。
以前は、Emscriptenを使ったWebAssemblyの出力には、別途Binaryenというツールのインストールも必要でしたが、現在(2017/05/06時点)では、Emscriptenのインストールのみで出力が可能になっています。(確認したところ、incoming版のインストールも必要がないようです。)
まずは、インストーラを使ってインストール
Emscriptenの公式サイトから、Windows用のインストーラをダウンロードし、実行します。Offline版のほうが確実ですので、そちらを選ぶと良いでしょう。デフォルトの設定で問題ありません。
インストールが完了したら、コマンドプロンプトから「emsdk」と打って、何か出ればおそらくOKです。
incoming版を入れる
この記事の執筆時点(2017/05/06)では、WebAssemblyを出力するためにはincoming版が必要です。incomingをインストールするためには、さきほどインストールしたemsdkを使用します。なお、単にWebAssemblyを出力できるようにしたい場合には、incoming版は必要なく、以下の手順のうち、「事前準備」のgitのインストールのみを行い、SDKのアップデートのところで、「sdk-incoming-64bit」の代わりに「latest」として実行してください。(gitがない場合、うまく最新のものをインストールしてくれないようです。)
事前準備
以下のツールを事前にインストールしておく必要があります。
両ツールとも、git、cmakeと打つと実行できるようにパスを通しておきます。(ちなみに、筆者はVisual Studio 2015の入っていない環境を持っていないため分からないのですが、もしかすると入っていない環境では異なるかもしれません…)
Emscripten SDKのアップデート
事前準備が整ったら、管理者権限でコマンドプロンプトを立ち上げ、以下のコマンドを実行していきます。
1 2 3 4 5 |
emsdk update emsdk install sdk-incoming-64bit emsdk activate sdk-incoming-64bit --global |
2行目を実行するとダウンロードとコンパイルが行われるため、完了までに1~2時間ほどかかります。3行目の実行には、管理者権限が必要です。ちなみに、3行目の「–global」をつけない場合、コマンドプロンプトを立ち上げるたびにincoming版ではなく通常版のEmscriptenを使うように戻ってしまうため、注意してください。
以上が完了したら、たとえば、コマンドプロンプトに「where emcc」と打ち、「C:\Program Files\Emscripten\emscripten\incoming\emcc」といった具合に、incoming版が参照されていればOKです。
Makeを入れる
Emscriptenで本格的に開発を進めていく場合、makeコマンドはほぼ必須です。もしインストールされていない場合は、以下のものを使うと良いと思います。
- Make for Windows (http://gnuwin32.sourceforge.net/packages/make.htm)
上記のMake for Windowsには、LibIntlとLibIconvも必要なようです。
- LibIntl for Windows (http://gnuwin32.sourceforge.net/packages/libintl.htm)
- LibIconv for Windows (http://gnuwin32.sourceforge.net/packages/libintl.htm)
これらのサイトから、Binariesをダウンロードし、各binディレクトリ内のファイルを、パスの通っているディレクトリに入れて下さい。コマンドプロンプトから「make」と打って実行されればOKです。
コンパイルしてみる
WebAssemblyへコンパイルしてみます。適当なディレクトリに「hello.c」というファイルを作り、以下のコードを書きます。
1 2 3 4 5 6 7 8 9 |
#include <stdio.h> int main() { printf("Hello World"); return 0; } |
保存したディレクトリに移動し、以下のコマンドでコンパイルします。(初回のみ、すごく時間がかかりますが大丈夫です。)
1 2 3 |
emcc hello.c -o hello.html -s WASM=1 |
「-s WASM=1」というオプションがWebAssemblyへのコンパイルオプションです。もし、対応していない場合はエラーが出ると思います。
さて、コンパイルが完了したら、「hello.html」「hello.js」「hello.wasm」という3つのファイルが出来ています。hello.htmlをFirefox(52以上) で開くと、Hello Worldと表示されるはずです。