FlutterをUTM上のDebianで動かしてみた

はじめに

この記事は、Qiita Advent Calendar 8日目の記事です。
以下の記事より、すべての記事をご覧になれます。

筆者について

• 現在高校２年生
• 水泳部マネージャー
• 生徒会長
• とある団体の代表

本編

##　経緯

Flutterでの開発をずっとしてみたいと思っていて、最近開発を仮定しているSOKFIもモバイル向けネイティブアプリをFlutterで書こうと思っています。しかし、クロスプラットフォームがFlutterのいいところ、せっかくならパソコン向けにもアプリを出したいと考えていました。そこで、僕が大好きなLinuxに対応させることにしたのです。

環境づくり

さて、環境は以下の通りにしました。

• Host：Macbook Air (M1)
• Guest：Debian
• VM：UTM(QEMU)

以下、自分自身が忘れないためにも設定を記述していきます。

①Debianイメージのダウンロード

以下のページよりDebianのISOをダウンロードしましょう。以下のページにアクセスして「arm64」をクリックすると自動敵にダウンロードが始まります。

②UTMにVMを作成する

まず、UTMをインストールしてない方はUTMをインストールしてください。

shell

# Homebrewをインストールしてない方はすると便利です。
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

# UTMのインストール
brew install --cask utm

それぞれ下にリンクを置いておきます。

インストールが終わり次第、VMの作成に移ります。

プラスマークを押して〜

Linuxを選択して〜

Virtualizeを選択して〜

Boot ISO Imageで先ほどダウンロードしたISOを選択して〜

ここから先も好きなだけ設定して〜（メモリは4GB分ぐらいあったほうがいいとは思います。8GBしかない人は頑張ってください。）

それでは、スタートボタンよりいざブートです！

こっから先は好きな設定にしてください。たとえば、キーボードなんかは、僕のMacはUS配列なので米国を選択しています。

ここで、ディスクの設定ですが、すべてパーティションは削除してください。ここから先に個人用のフォルダのパーティションを分割するとかいうとこもでてきますが、基本的のそのような設定は不必要だとお思います。（あくまで検証用なので）

ここから先はかなりファイルのダウンロードをするので、テザリングとかの人は気をつけてください。

ということでここまで来たらインストールは完了です！一旦続けるを押して再起動が終わったとあとにシャットダウンしてください。
ディスクを取り出して、もう一度起動しましょう！

ログインして以下のような画面が出てきたら成功です。おめでとうございます！

ではここからは個人が設定しやすい設定をしてください。（ZSHに変更、VSCodeのインストール等々…。）

Flutter (Arm)をインストール

基本は以下の記事に従ってインストールさせていただきました

shell

git clone https://github.com/flutter/flutter
sudo mv flutter /opt/

#以下は~/.zshrcまたは~/.bashrcなどに記述
export PATH=$PATH:/opt/flutter/bin

#ここで自動的にFlutterのインストールが始まります
flutter doctor

#もし成功すれば以下のような画面が出てきます
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel master, 3.18.0-7.0.pre.14, on Debian GNU/Linux 12
    (bookworm) 6.1.0-12-arm64, locale ja_JP.UTF-8)
[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from:
      https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK
      components.
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup
      for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.

[✗] Chrome - develop for the web (Cannot find Chrome executable at
    google-chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[✓] Linux toolchain - develop for Linux desktop
[!] Android Studio (not installed)
[✓] VS Code (version 1.83.0-insider)
[✓] Connected device (1 available)
[✓] Network resources

! Doctor found issues in 3 categories.

それでは、お試しアプリ作って起動しましょう。

shell

flutter create sample; cd sample
flutter run

必要なコンポーネントがインストールされた後に、アプリがビルドされて起動されます。
例のカウンターアプリが起動されたらOKです。

最後に

今回はFlutterをArmのDebian上で動かしてみました。ちなみに、Armはもとより、Linux上でサポートされてないライブラリって結構多いので、きちんと対応しているかについて調べ手から使うことをお勧めします。ということで、以上今日はいつもとは少し違う記事でした。それではは、引き続き今後のアドカレ 23 の記事をお楽しみにしてください。