Arantium Maestum

プログラミング、囲碁、読書の話題

js_of_ocamlをduneでビルドしてブラウザで確認するための最小構成

ここ数日、ブラウザゲーム的なものを作りたくなってJs_of_ocamlを調べていた。

duneを使ってビルドできるのがわかったのだが、どういう構成でやれるのかは少し試行錯誤があったので、半ば備忘録もかねて記事にしておく。

この記事ではタイトルどおり最小構成を目指す。具体的にはコンソールに出力するだけのコードをOCamlで書いて、duneでJSにコンパイルしたものを参照するhtmlをブラウザで開く、というもの。

ディレクトリ構成:

.
├── dune
├── main.ml
└── main.html

main.ml:

let () = print_endline "Hello"

ロジックは最低限。OCaml的にStdoutへ出力するとJS/ブラウザではコンソールに出力される。

main.html:

<html>
    <head>
        <script type="text/javascript" src="_build/default/main.bc.js"></script>
    </head>
    <body>
    </body>
</html>

duneが出力するJSファイルをscriptとして読み込んでいるだけ。

duneファイル:

(executable
  (name main)
  (modes js))

あとはdune buildコマンドでビルドする:

$ dune build ./main.bc.js

これでブラウザでmain.htmlを開いてJavascript Consoleを見れば"Hello"と出力されている。