Tauri アプリの開発サイクルにおける、アプリの起動、ホットリロード、デバッグ方法について解説します。
開発サーバーの起動
以下のコマンドを実行すると、開発モードでアプリが起動します。
npm run tauri dev
このコマンドは以下の手順を自動的に行います。
1. tauri.conf.json の beforeDevCommand を実行(フロントエンドの開発サーバー起動)。
2. Rust バックエンドのコンパイル。
3. アプリウィンドウの立ち上げ。
フロントエンドのコードを変更すると、Web ビューが自動的にリロードされます(HMR)。
Rust コードを変更すると、自動的に再コンパイルされてアプリが再起動します。
フロントエンドのデバッグ
Tauri アプリのウィンドウ内で、Web ブラウザと同様の開発者ツール(DevTools)を使用できます。
- Windows / Linux:
Ctrl+Shift+IまたはF12 - macOS:
Cmd+Option+I
または、右クリックメニューから「Inspect(検証)」を選択して開くことができます(プロダクションビルドではデフォルトで無効化されます)。
ここで console.log の出力確認や、DOM の検査、ネットワークリクエストの監視が可能です。
バックエンド (Rust) のデバッグ
Rust 側のログ出力には、println! マクロや log クレートを使用します。
出力内容は、npm run tauri dev を実行しているターミナルに表示されます。
// src-tauri/src/main.rs
#[tauri::command]
fn greet(name: &str) -> String {
println!("Greeting requested for: {}", name); // ターミナルに表示される
format!("Hello, {}!", name)
}
VS Code を使用している場合、CodeLLDB 拡張機能を使用することで、Rust コードにブレークポイントを貼ってステップ実行することも可能です。