Tauri2.0 prereleaseを試してみた

最初に

Tauri2.0 prereleaseを試してみたので、備忘録兼解説です
Tauri2.0 prereleaseとさっきから読んでいますが、公式がTauri1.5と呼んでいるので、今後はこれで行きます

また、わからない表現があったら、ChatGPTに聞いてください。業界標準で書いているつもりなので、説明してくれるはずです。

容量は1プロジェクトだけで12GB程持っていかれます。環境が無かった人はもっと持っていかれるので注意してください

こんな中途半端な時期に始めた理由は、新しいアプリを作ろうと思ったからです。
出来上がったもの見たいなのは、ここです

最後に、この記事は2023/11/04日時点での記事です。注意してください

導入

公式を参考に進めていきます

私の環境はWindows+Androidなので、それ前提で行きます。なお、AndroidStudioなどが必要になるので、WSL2でやるのは諦めた方がいいです。

公式に従って、Microsoft C++ ビルド ツールをVisual Studioから入れます。Siv3Dなどを使ったことがある方などは既に入ってると思います。

次に、WebView2から、Evergreen Bootstrapperをインストールします。Tauri 1.0を触ったことがあるなら既に入っていると思います。

そして、醍醐味のRustを入れます。Rust公式からinstallします。まぁこの記事読むような人はもう入ってると思います（てか触ったことなかったらコードを理解できないと思います）。
既に入っている人はrustup updateでバージョンを最新にします。

Android向けにビルドするために、JAVAがいるので、JAVA_HOME環境変数を設定します。コツは、バージョンは17にすることです。21はGradleがまだ対応しておらず（1敗）、20はTauriが使っているバージョンが古いのか、対応してませんでした。17なら絶対いけると思います。

次に、Android Studio の SDK Managerから、

• Android SDK Platform
• Android SDK Platform-Tools
• NDK (Side by side)
• Android SDK Build-Tools
• Android SDK Command-line Tools
  を全て入れます。

そして、環境変数をまた設定します。
ANDROID_HOMEと、NDK_HOMEですね。
ANDROID_HOMEは大抵~\AppData\Local\Android\Sdkです
NDKはさらにその中の、~\AppData\Local\Android\Sdk\ndk\26.1.10909125などにあります。バージョンはそんなに気にしないでいいと思いますが、とりま最新がお勧めです。

そして、Android向けにビルドする際に、あらゆるデバイスで動作させるため、幾つかのコンパイル先を追加します。
rustup target add aarch64-linux-android armv7-linux-androideabi i686-linux-android x86_64-linux-android

プロジェクトを作成してみる

cargoバージョン

cargo install create-tauri-app
cargo create-tauri-app --alpha

npmバージョン

npm create tauri-app@latest -- --alpha

powershellバージョン

$env:CTA_ARGS="--alpha"; irm https://create.tauri.app/ps | iex

好きなのを使いましょう。

選択では、今回はSolidJSを使います。自分の推しなので。
また、WebのUIをwasmを用いることでRustで書くことができるのですが、現在は生成されたアプリが動かないため、割愛します。

なので、

• TypeScript / JavaScript (pnpm, yarn, npm, bun)
• npm（本当はBunを使いたい）
• Solid（SolidStartは干渉しそうだった）
• TypeScriptでやっていきます
• y モバイルも当然yesです

TauriCLI

cargo install tauri-cli --version "^2.0.0-alpha"

で入れることができますが、今回はRust Onlyではないため、使う理由がありません。よって、使いません。

プロジェクトのスタート

cd tauri-app
npm install
npm run tauri android init

# For Desktop development, run:
npm run tauri dev

# For Android development, run:
npm run tauri android dev

修正

ということで早速とばかりにnpm run tauri devするとエラーが発生します。なので、プログラムを修正します。

import { createSignal } from "solid-js";
import logo from "./assets/logo.svg";
- import { invoke } from "@tauri-apps/api/tauri";
+ import { invoke } from "@tauri-apps/api/primitives";
import "./App.css";

また、npm run tauri android devも実はうまく動きません。
これは、モバイルの検出がうまくいっていないためであり、このコマンドを実行するときだけこうします。

+ const mobile = !!/android|ios/.exec(process.env.TAURI_PLATFORM);
const mobile = true;

※アプリを既にインストールしていると失敗するため先にアンインストールしてください

また、VSCodeの解析がうまく働くように、tsconfig.jsonもこれに書き換えます

tsconfig.json

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ESNext", "DOM", "DOM.Iterable"],
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve",
    "jsxImportSource": "solid-js",
    "esModuleInterop": true,

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,

    /* develop */
    "baseUrl": "./",
    "paths": {
      "~/*": [
        "./src/*"
      ]
    },

    // types
    "types": [
        "vite/client",
    ],
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

更に、src-tauri\gen\android\app\build.gradle.ktsを書き換えます
なぜなら、今のcompileSdkは34だからです。しかし、Gradleは8.0.0を使っているため、警告が来ますが、コンパイルできたので問題ないと思います。また、このままビルドすると、署名されていないapkができてしまい、インストールできません。
※aabファイルは問題なくできあがります

ということで、署名

build.gradle.kts(app)

android {
-   compileSdk = 33
+   compileSdk = 34
    namespace = "com.tauri.tauri_app"
    defaultConfig {
        manifestPlaceholders["usesCleartextTraffic"] = "false"
        applicationId = "com.tauri.tauri_app"
        minSdk = 24
-       targetSdk = 33
+       targetSdk = 34
        versionCode = 1
        versionName = "1.0"
    }
+   signingConfigs {
+       create("mySigningConfig") {
+           // keytool -genkey...で作れる。デバッグ用のは、`~\.android\debug.keystore`にある
+           storeFile = file("C:/bin/key/my-key.keystore")
+           // KeyStore作成時に設定した値を覚えておく必要有り
+           storePassword = "password"
+           keyAlias = "alias"
+           keyPassword = "password"
        }
    }
    buildTypes {
        ・
        ・
        ・
        getByName("release") {
+           signingConfig = signingConfigs.getByName("mySigningConfig")
            isMinifyEnabled = true
            proguardFiles(
                *fileTree(".") { include("**/*.pro") }
                    .plus(getDefaultProguardFile("proguard-android-optimize.txt"))
                    .toList().toTypedArray()
            )
        }
    }
    kotlinOptions {
        jvmTarget = "1.8"
    }
}

因みに、apkファイルでインストールした場合は約56.44MB、aab->apksでインストールした場合は、約17.84MBで、超軽量化しますが、aabだとpcからいれなきゃいけなくてダルイですよね

疲れたのでここで止めます