読者です 読者をやめる 読者になる 読者になる

ムラサメ研究ブログ

主にゲームやプログラミングのログ

WebAssembly Windows環境構築

Windows環境を作るにあたって

公式ページでは下記のように http://webassembly.org/getting-started/developers-guide/

The instructions on this page are applicable to Linux and Mac OS X systems. Similar instructions for Windows systems are forthcoming.

Windows環境の構築については まだ手順がなさそうなので 挑戦してみます

構築

基本的には公式の LinuxMac環境構築を参考にします http://webassembly.org/getting-started/developers-guide/

ChromeのWebAssembly有効化

chrome://flags/#enable-webassembly と Chromeで入力し WebAssemblyを有効にし 再起動させる!

emsdkをインストール

https://kripken.github.io/emscripten-site/index.html

ダウンロードページよりWindowsバイナリを入手しインストール インストール時にパスも通してくれるので 私は通した。

emsdkのパッケージ更新

Linuxの手順で行うと、gitがないと怒られたので、gitも入れます

> emsdk update
> emsdk install git-1.9.4
> emsdk install clang-incoming-64bit emscripten-incoming-64bit sdk-incoming-64bit
> emsdk activate clang-incoming-64bit emscripten-incoming-64bit sdk-incoming-64bit

一通り環境整ったはずなので テストします

emsdk テスト

上記の公式をもとに、Cでソースをかきます たとえば hello.c を作成

#include<stdio.h>
int main(int argc, char ** argv ){
  printf("Hello, world!\n");
}

ビルドします

> emcc hello.c -s WASM=1 -o hello.html

結構コンパイル時間かかったし Warningもいっぱい出ましたが無事ファイルが複数できました before.js、hello.html、hello.js、hello.js.temp.js の4ファイルが私の環境ではできました。 このうちの hello.htmlが目的のものなので ブラウザで表示しましょう。

Apache等あればそこで表示してもいいです 公式では pythonを使って

> python -m SimpleHTTPServer 8080

ブラウザより localhost:8080/hello.html

をたたくと、Emscriptenウインドウに Hello,World! が表示されるはず。 表示されたら成功! おめでとう!

とのことらしいですが、期待していたバイナリが出ていないような・・・

> emcc -O2 hello.c -s WASM=1 -o hello.html

と、最適化オプションつけると hello.wasm、load-wasm-worker.js、hello.html.mem などの 怪しいものが出てきます・・

このあたり 一度調査必要ですね

とりあえず公式的には環境完成のようです