WSL containersでVivliostyle CLIイメージを利用する

Vivliostyle CLIでは、renderMode: dockerを廃止する方向で進めています。コンテナ管理がプラットフォームに統合されつつある時流に合わせて、それぞれにおける使い方や利点を整理しているところです。

WSL containersでも、Vivliostyle CLIイメージを使用できます。

PS > wslc version
wslc 3.0.1.0
PS > wslc pull ghcr.io/vivliostyle/cli:11.3.3
PS > wslc run --rm ghcr.io/vivliostyle/cli:11.3.3
Usage: vivliostyle [options] [command]

Options:
  -v, --version   output the version number
  -h, --help      display help for command

Commands:
  create          Scaffold a new Vivliostyle project
  init            Create a Vivliostyle configuration file
  build           Create PDF, EPUB, and other publication files
  preview         Open the preview page and interactively save PDFs
  theme           Create and validate Vivliostyle theme packages
  help [command]  display help for command

コマンド自体には特殊なことはなく、以下のようにこれまで通り実行できました。

ただしWindows側ファイルシステムのマウントは非常に低速です¹。npm ciには3分、A5判・296ページ・CMYK有効・相互参照を多用した一般的なIT技術書のビルドには8分半ほどかかりました。従来のWSL＋Docker Desktopセットアップでは、プロジェクトディレクトリをWSL側のファイルシステムに置いてWSLからdockerコマンドを使用することで、WSLのI/O性能に準じたマウントが可能でした。現時点のWSLCには、これに直接対応する使用方法はありません²。

PS > wslc run `
  --rm `
  --volume .:/data `
  --entrypoint npm `
  ghcr.io/vivliostyle/cli:11.3.3 `
  ci

PS > wslc run `
  --rm `
  --interactive `
  --tty `
  --volume .:/data `
  --entrypoint /data/node_modules/.bin/vivliostyle `
  ghcr.io/vivliostyle/cli:11.3.3 `
  build

WSLgでのプレビューには、WSLgを利用可能なWSLディストリビューションからソケットをsocatで転送する必要があります³。また、プレビュー中に原稿を編集してもライブリロードは発火しません。なお従来のWSL＋Docker Desktopでは、WSL側のファイルシステムに配置して編集する場合にはライブリロードが機能していました。

$ sudo apt update && sudo apt install --yes socat
$ socat TCP-LISTEN:6000,bind=127.0.0.1,reuseaddr,fork UNIX-CONNECT:/tmp/.X11-unix/X0

PS > wslc run `
  --rm `
  --interactive `
  --tty `
  --volume .:/data `
  --env DISPLAY=host.wslc.internal:0 `
  --entrypoint /data/node_modules/.bin/vivliostyle `
  ghcr.io/vivliostyle/cli:11.3.3 `
  preview

プロジェクトディレクトリを名前付きボリュームに転送することで性能は改善します。同様にプレビューも可能ですが、Windows側の実体とは分離するので、何らかの方法でボリュームに反映しない限りライブリロードは機能しません⁴。

現状のwslc container cpでは、WSLC（またはWSL）で作成したLinuxのシンボリックリンクを扱えません⁵。ここまでのコマンドを順に実行している場合は、node_modulesと.vivliostyleは削除してから試してください。

PS > wslc volume create my-proj

PS > wslc create --name transfer --volume my-proj:/my-proj busybox
PS > wslc container cp ..\my-proj transfer:/
PS > wslc remove transfer

PS > wslc run `
  --rm `
  --volume my-proj:/data `
  --entrypoint npm `
  ghcr.io/vivliostyle/cli:11.3.3 `
  ci

PS > wslc run `
  --rm `
  --interactive `
  --tty `
  --volume my-proj:/data `
  --entrypoint /data/node_modules/.bin/vivliostyle `
  ghcr.io/vivliostyle/cli:11.3.3 `
  build

ボリュームは次のコマンドで削除できます。

PS > wslc volume remove my-proj

1. 従来の仕組みと比べて「twice as fast」ということなのですが。 ↩

2. https://github.com/microsoft/WSL/issues/41751 ↩

3. https://github.com/microsoft/WSL/issues/41000#issuecomment-5928018961 ↩

4. メモ：wslc system session shellでバッキングVMに入れる。/var/lib/docker/volumes/{名前}/_dataにボリュームの内容が格納されている。VM内のviで原稿を変更するとライブリロードが発火した。Windows側のアプリ（たとえばVS Code）で、ここで直接作業ができたらよいはず。 ↩

5. https://github.com/microsoft/WSL/issues/41793 ↩