at backyard

Color my life with the chaos of trouble.

DenoでHTMLを用いたGUIアプリが作れるCarolを試してみたのと、ゆっくり吹き替え on Macについて

目次

Carolについて

Carolという、DenoとHTMLを使ってデスクトップアプリケーションを構築するためのDenoモジュールがある。 UIはローカルにインストールされたGoogle Chromeを利用するらしい。

github.com

ちなみに作者の方がQiitaに投稿されていたので、日本語の情報もまとまっている。

qiita.com

なお、このモジュールは、carloをDenoに移植したもののようだ。

github.com

Carolを起動させてみる

まずはREADMEにならって、最初の一歩を踏み出してみる。

// hello.ts
import { launch } from "https://deno.land/x/carol/mod.ts";
import { dirname, fromFileUrl, join } from "https://deno.land/std/path/mod.ts";

const app = await launch({
  title: "Hello Deno!",
  width: 480,
  height: 320,
});

app.onExit().then(() => Deno.exit(0));

await app.exposeFunction("greet", (name: string) => `Hello, ${name}!`);
const folder = join(dirname(fromFileUrl(import.meta.url)), "public");
app.serveFolder(folder); // Serve contents from "./public" folder
await app.load("index.html");

上記のソースコードを読めばだいたいのことはわかるようになっているが、public/index.html を読み込んで表示させる内容となっているので、画面用のファイルとして下記のHTMLファイルを public/index.html として作成する。

<html>
<body>
  <div>Hello, Deno!</div>
  <script>
    window.onload = async () => window.alert(await window.greet("Deno"));
  </script>
</body>
</html>

そして下記のコマンドを叩くことでGoogle Chromeが起動し、GUIアプリが立ち上がる。

deno run --allow-env --allow-read --allow-write --allow-run --allow-net hello.ts

Carolで作成したGUIアプリをシングルバイナリにコンパイルする

Denoの魅力としてシングルバイナリを簡単に作成できるというものがある。
しかもMac環境でもWindowsLinux向けのバイナリが作成できる、クロスコンパイルが可能であるというのも魅力的。

Carolで作成したGUIアプリもシングルバイナリとして配布できればかなり便利なので、こちらも試してみる。

上で作成したHello World的なアプリをコンパイルしてみる。

なお、クロスコンパイルについては以前こちらのブログにも書いたので、興味ある方はぜひぜひ。

shinshin86.hateblo.jp

deno compileコマンドでシングルバイナリを生成(失敗)

下記のコマンドでhelloworld というバイナリをM1 Mac向けに作成する

deno compile --allow-env --allow-read --allow-write --allow-run --allow-net --target aarch64-apple-darwin --output helloworld hello.ts

上のコマンドを打ったら、下記のようなエラーが出てしまった。。。

error: Relative import path "fs" not prefixed with / or ./ or ../ from "https://unpkg.com/puppeteer@10.2.0/lib/esm/puppeteer/common/helper.js"

ここらへんの問題なのかなと思って、一度 deno upgrade で最新化して --compat オプションつけて実行してみたら、エラーがなくなった。

zenn.dev

ただ、その後いろいろ試してみると、--compat オプションつけなくても実行できたので、もしかしたら上のコマンドは何かが間違っていたのかもしれない。

どこがいけなかったのかがよく分からなかったので備忘録として上の記述はそのまま残しておくことにした。

まだ、もしかしたらDenoのversionを上げたことによる影響などもあるのだろうか?

deno compileコマンドでシングルバイナリを生成(成功)

というわけで、下記のコマンドを実行することでシングルバイナリを生成することができた。

# M1 Mac用のバイナリを生成する
deno compile --allow-env --allow-read --allow-write --allow-run --allow-net --output helloworld --target aarch64-apple-darwin hello.ts

生成されたバイナリを叩くことで、同じ動きをするアプリが立ち上がる。

./helloworld

ちなみにこのバイナリだが、既にCompile時点で読み込んでいるindex.htmlなども内包する形となっているので、後はこのバイナルだけ配布すれば、そのまま同じ動きをする。
(ただ実行環境内にインストールされたChromeがないといけないとは思う)
これはアプリケーションを作る側としては非常に楽で良い。

WindowsLinux版などのバイナリでも問題なく同様の動きをするかまでは検証していないが、ひとまずこの点だけでもかなり嬉しいポイント。

Carolをなぜ試そうと思ったか?

ここからは個人的な話となるが、今回Carolを試したのは自身で作成した下記のツールをどうにかしてシングルバイナリとして配布できないかと考えていたからだ。

github.com

まだこちらのアプリは、ひとまず他の人も試せるようにしたというレベルであり、利用する際にはAquesTalk10、AqKanji2Koe の評価版ライブラリをダウンロード・セットして自身で yarn start を実行の上、ブラウザ上で作成する必要がある。
(※詳しい利用方法については下記を参照)

free-sound.shinshin86.com

ただ、後々はライセンス周りの手続きをした後パッケージ化して配布できたら良いなとは考えている。

以前nexeを使ってシングルバイナリ化できないか試行錯誤していたが、残念ながらそれはできなそうだった。

github.com

おそらく外部モジュールを含めて一緒にコンパイルする部分で失敗していたのか、結局シングルバイナリ化はできず、そのまま別の作業に興味は移ってしまっていったが、今回久しぶりにこちらの作業を進めようと思い、Denoでコンパイルしてシングルバイナリ化できないかというところでCarolを見つけた。

DenoでHTMLをホストする形でGUIアプリを作れるというのもポイントだったが、ローカルにインストールされているGoogle Chromeを介してGUIアプリを機能させるというのもポイントだった。

Carol以外にGUIアプリとして機能させるためのライブラリとして候補に上がったのがElectronだったが、こちらは内部でChromiumを採用している。

だが、このyukkuri-hukikae-on-mac(ゆっくり 吹き替え on Mac)ではGoogle音声認識APIを内部で利用しているのだが、これはChromiumだと利用制限がある。
(調査していたのは1年以上前のことのため、現在は異なっているかもしれない。)

そういうこともあり、できればGoogle Chromeで動かしたかったというアプリケーション側の事情があった。そういう点からもCarolはGoogle Chromeを動かしているのは都合が良かった。

というわけで、上記ツール(yukkuri-hukikae-on-mac(ゆっくり 吹き替え on Mac))をDenoで動かすことを最近検討している。

うまく動くかはまだ分からないが、うまく動けば良いなと思っている。

なにか進展があれば追ってご報告できたらと考えている。