Tauriでデスクトップアプリを開発する

概要

Tauriでアプリのひな形を作成して実行、ビルドするまでの手順をまとめました。

Tauriとは

Web技術とRustでデスクトップアプリを開発するためのフレームワークです。
Electronの様にUI側(Renderer Process)とCore側(Main Process)で構成されています。
UI側はOSのWebiViewを用いて描画し、Core側はRustで記述します。
Electronと比較して以下の様な特徴があります。

• ChromiumやNode.jsを同梱しないためファイルサイズが小さい
• メモリ使用量が小さい
• Core側をRustで記述するため速度が早い

準備

Tauriでアプリケーションを開発するには以下のものが必要です。

• Rust
  https://www.rust-lang.org/tools/install

• Node.js
  yarnをインストールしておきます。

• 各種ビルドツール
  今回はWindowsで開発するのでMicrosoft C++ Build Toolsをインストールします。

ひな形を作成

アプリケーションのひな形を作るには以下のコマンドを実行します。
実行すると対話形式で色々聞かれます。

$ yarn create tauri-app

アプリケーション名を入力します。

? What is your app name? tauri-sample

ウィンドウのタイトル名を入力します。

? What should the window title be? Tauri Sample

使用するフレームワークを選択します。
今回はReactを使用するのでcreate-react-appを選択します。

? What UI recipe would you like to add? create-react-app

tauri-apps/apiを追加します。

? Add "@tauri-apps/api" npm package? (Y/n) Y

create-react-appのテンプレートを選択します。
ここではTypescriptを選択します。

? Which create-react-app template would you like to use? create-react-app (TypeScript)

少し待つとカレントフォルダにtauri-sampleフォルダが作成されます。

実行

tauri-sampleフォルダの直下で以下のコマンドを実行します。

$ yarn tauri dev

アプリケーションが起動しました。

ビルド

実行ファイルとインストーラーを作成するには以下のコマンドを実行します。

$ yarn tauri build

すると以下のエラーが発生します。

yarn run v1.22.19
warning ..\..\..\package.json: No license field
$ tauri build
       Error You must change the bundle identifier in `tauri.conf.json > tauri > bundle > identifier`. The default value `com.tauri.dev` is not allowed as it must be unique across applications.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

src-tauri/tauri.conf.json内のidentifierの値を修正する必要があるようです。
適当な値に書き換えて再度コマンドを実行します。
ビルドが完了すると実行ファイルがsrc-tauri/target/releaseに作られます。

インストーラーはsrc-tauri/target/release/bundle/msiに作られます。

終わりに

難しい所は特にありませんでしたが、初回の実行やビルドは結構時間がかかりました。
まだTauriの日本語記事は少ないですが今後流行るかもしれないので
Rustの勉強も兼ねて色々調べていこうと思います。

参考文献