導入
今回はこちらの記事を参考にさせていただきながら、チュートリアル形式で進めていきます。
環境
Ubuntu Server 22.04
Flutter 2.0.1
VSCode 1.104.1
今回、Windows PC から Remote SSH を利用して Ubuntu 環境に接続し、Flutter の環境構築を実施しました。
ただし、実際の開発用途(特にエミュレータを使った動作確認やデバッグ)を考えると、ローカル環境に構築する方が現実的です。
Android エミュレータや iOS シミュレータは、リモート環境では基本的に利用できません。
Linux サーバー上での GUI デバッグは設定が煩雑で、Android Studio などの IDE 機能も制限されます。
Remote SSH は「軽量なコーディング作業」や「CI/CD 用のビルド環境」には便利ですが、日常的なアプリ開発には 直環境での構築 が推奨されます。
Flutterのインストール
wget -O ~/Downloads/flutter_linux_2.0.1-stable.tar.xz https://storage.googleapis.com/flutter_infra_release/releases/stable/linux/flutter_linux_2.0.1-stable.tar.xz
tar -xf ~/Downloads/flutter_linux_2.0.1-stable.tar.xz -C .
環境パスの設定
~/.bashrc
にパスを追加します。
$ vi ~/.bashrc
export PATH="$PATH:~/development/flutter/bin"
環境パスを更新
$ source ~/.bashrc
パスの確認
$ flutter --version
Flutter 2.0.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision c5a4b4029c (4 years, 7 months ago) • 2021-03-04 09:47:48 -0800
Engine • revision 40441def69
Tools • Dart 2.12.0
ビルド環境作成
必要なものをインストール
$ sudo apt install clang curl pkg-config ninja-build cmake libgtk-3-dev libblkid-dev liblzma-dev unzip
ビルドターゲットをLinuxにする
$ flutter config --enable-linux-desktop
環境のチェックを行う
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.1, on Linux, locale en_US.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
[✓] Linux toolchain - develop for Linux desktop
[!] Android Studio (not installed)
[✓] Connected device (2 available)
! Doctor found issues in 2 categories.
プロジェクト作成・実行
プロジェクトを作成
$ mkdir flutter_tutorial
$ cd flutter_tutorial
$ flutter create .
プロジェクト名には命名規則があります。
拡張機能 Flutter のインストール
今回使用しているFlutterバージョンが最新バージョンでは対応されていなかったので、過去バージョンを選択してインストールしました。
「特定のバージョンをインストール」 --> 「3.20.0」を選択
実行
以下のコマンドで実行
$ flutter run -d linux
Launching lib/main.dart on Linux in debug mode...
Building Linux application...
(flutter_tutorial:37870): Gtk-WARNING **: 12:59:42.058: cannot open display:
Error waiting for a debug connection: The log reader stopped unexpectedly.
Error launching application on Linux.
今回、UBuntu Serverを使用していたため、GUI前提の実行ができませんでした。
以下、web-serverでの実行は確認できました。
$ flutter run -d web-server
Launching lib/main.dart on Web Server in debug mode...
Waiting for connection from debug service on Web Server... 16.6s
lib/main.dart is being served at http://localhost:37813
The web-server device requires the Dart Debug Chrome extension for debugging. Consider using the
Chrome or Edge devices for an improved development workflow.
🔥 To hot restart changes while running, press "r" or "R".
リリースビルド
リリースビルドは可能でした。
$ flutter build linux
Building without sound null safety
For more information see https://dart.dev/null-safety/unsound-null-safety
Building Linux application...
linux
の部分は以下のレパートリーがあります。
-
apk
(Android アプリ) -
appbundle
(Google Play 向け Android App Bundle) -
ios
(iOS アプリ, 要 macOS + Xcode) -
ipa
(iOS アプリの ipa ファイル出力, 要 macOS) -
macos
(macOS アプリ, 要 macOS) -
windows
(Windows デスクトップアプリ, 要 Windows) -
linux
(Linux デスクトップアプリ, 要 Linux) -
web
(Web アプリ, 要 Flutter web 環境)
以下のコマンドで使用可能なデバイスを取得できます。
$ flutter devices
2 connected devices:
Linux (desktop) • linux • linux-x64 • Linux
Chrome (web) • chrome • web-javascript • Google Chrome 140.0.7339.185
GUI前提となる場合、Ubuntu Serverでは直接実行ができないため、
flutter run -d web-server
で Webサーバーモードで起動することで確認できました。
まとめ
Remote SSHで実施したため、少々複雑になりましたが
それでも比較的シンプルな環境構築だと思いました。
次回の画面作成編に続きます。
参考