More than 1 year has passed since last update.

Flutter CLI (Flutter Roadmap Flutter CLI)

Last updated at 2023-08-16Posted at 2023-08-16

はじめに

Flutterを網羅的に学習するにあたってRoadmapを使って学習を進めることにしました。

この記事では、Flutter初学者やこれからFlutterを学習し始める方に向けて、Flutter CLIについてまとめています。

RoadmapはFlutterだけでなく、他の言語やスキルのロードマップも提供されており、何から学習して良いか分からないと悩んでいる方にとって有用なサイトになっています。
ぜひRoadmapを利用して学習してみてください。

Roadmapとは

簡潔に言えば、Roadmap.shは学習者にとってのガイドブックであり、学習の方向性を提供する学習ロードマップサイトです。

初心者から上級者まで、ステップバイステップでスキルを習得するための情報が提供されています。

学習の進め方が分かりやすく示されているだけでなく、個々の項目に参考資料やリソースへのリンクも提供されているので、学習者は目標を設定し、自分自身のペースで学習を進めることができます。

Flutter CLI

FlutterロードマップFlutter CLIでは以下の3つのサイトが紹介されています。興味のある方はぜひお読みください。

The Flutter command-line tool: https://docs.flutter.dev/reference/flutter-cli
CLI Packages in Flutter: https://dart.dev/server/libraries#command-line-packages
Get started with Flutter CLI: https://dart.dev/tutorials/server/get-started

Flutter CLIとは

Flutter CLI（Command Line Interface）は、Googleによって開発されたFlutterのコマンドラインツールです。Flutter CLIを使用することで、ターミナルやコマンドプロンプトからFlutterプロジェクトの作成、ビルド、テスト、デプロイなどの操作を行うことができます。CLIを使用することで、開発プロセスを効率化し、自動化することができます。

コマンド一覧

1. Flutterの環境診断

開発環境がFlutterのプロジェクトをビルドおよび実行する準備が整っているかどうかをチェックするために使用されます。主に以下の3つの目的で利用されます。

依存関係の確認: 依存関係が正しくインストールされているのかをチェック
設定の確認: 開発環境が正しく設定されているかどうかのチェック
警告と解決策の提示: 設定に関する問題を検出した場合、警告メッセージを表示し、解決策を提供

-vをつけることで、詳細な情報を確認することができます。

flutter doctor # flutter doctor -v で詳細情報を見れます

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.10.2, on macOS 13.3.1 22E261 darwin-arm64, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.80.1)
[✓] Connected device (2 available)
[✓] Network resources

• No issues found!

2. SDKバージョンを確認

現在使用しているSDKバージョンを確認することができます。

flutter --version
Flutter 2.5.3 • channel dev • https://github.com/flutter/flutter
Framework • revision 83dd176777 (12 days ago) • 2020-09-22 12:04:44 -0700
Engine • revision 2abe69c608
Tools • Dart 2.10.0 (build 2.10.0-136.0.dev)

出力情報	内容
Flutter 2.5.2	インストールされているFlutterバージョン
channel dev	使用しているFlutterのリリースチャネル
https://github.com/flutter/flutter	ソースコードがホストされているリポジトリのURL
Framework • revision 83dd176777	Flutterフレームワークの最新コミットです
Engine • revision 2abe69c608	Flutterエンジンの最新コミットです
Tools • Dart 2.10.0	使用しているDart言語のバージョン

3. バージョンをアップデート

Flutterフレームワークとその関連ツールを最新バージョンにアップデートすることができます。

flutter upgrade

4. バージョンをダウングレード

Flutterフレームワークを特定のバージョンにダウングレードすることができます。
ダウングレードにより、特定のバージョンに戻ることで問題を解決したり、コードの動作を維持したりすることができます。

flutter downgrade <バージョン>

5. 使用しているFlutter SDKのチャネルを確認

現在使用しているFlutter SDKチャネルを確認します。

flutter channel
Flutter channels:
  master
  dev
  beta
* stable

より最新のソースを使用したければ、masterチャネルに切り替え、最も安定したソースを使用したければstableチャネルに切り替えます。

チャネル	内容
master	GitHubのmasterブランチに相当するもので、最新のソースがコミットされているチャンネルになります。最新である反面、安定さには欠けるチャンネルというのが特徴です。
dev	master channelのうち、テストに通過したソースがこのチャンネルです。masterに比べてテストを通過している分、安定性は増しているチャンネルと言えます。
beta	dev channelのうち、品質が高いと認められたものが月初に更新されるチャンネルです。これもdev channelからより良いものを選んで追加されている分、安心して使えるチャンネルになっていると言えます。
stable	Flutterをインストールした時にデフォルトで選択されているチャンネルがstable channelです。これは最も安定性が高いので利用が推奨されているチャンネルでもあります。stable channelでは四半期に一度の更新となっているようです。

6. チャンネルの変更

オプションで指定したチャンネルに変更することができます。

flutter channel beta # beta版に切り替える

7. 実行可能なデバイスを確認

Flutterアプリを実行するために利用可能なデバイスの一覧を確認することができます。
エミュレータの場合は、起動した状態でないと表示されません。

flutter devices

3 connected device:

macOS (desktop) • macos  • darwin-arm64   • macOS 13.3.1 22E261 darwin-arm64
Chrome (web)    • chrome • web-javascript • Google Chrome 115.0.5790.170
iPhone 12 (mobile) • ABCD1234-5678-1234-5678-ABCD1234EFGH • ios • com.example.myapp

8. Flutterの設定情報を管理する

~/.flutter_settingsにある設定ファイルを更新することができます。
このファイルを編集することで、個別の設定を指定したり、デフォルトの動作を変更したりすることができます。

# Flutter Webを有効化
flutter config --enable-web

# Flutter Desktop Linuxを有効化
flutter config --enable-linux-desktop

# Flutter Desktop macOSを有効化
flutter config --enable-macos-desktop

# Flutter Desktop Windowsを有効化
flutter config --enable-windows-desktop

9. Flutterプロジェクトを新規に作成する

Flutterプロジェクトを新規に作成することができます。オプションの最後に出力先のディレクトリ名を指定します。

flutter create -t app --org com.example --project-name ¥
example -i swift -a kotlin ¥
--description "Example Project" ¥
./example.app

オプション	内容
-t, --template=	`app`, `module`, `package`, `plugin`のいずれかを指定するデフォルトはapp
--org	オーガナイゼーションを指定するデフォルトはcom.example
--project-name	Flutterプロジェクト名を指定する
-i, --ios-language	iOS向けプラットフォーム側のコードの言語で`objc`, `swift`のいずれかを指定するデフォルトはswift
-a, --android-language	Android向けプラットフォーム側のコードの言語で`java`, `kotlin`のいずれかを指定するデフォルトはkotlin
--description	プロジェクト説明文デフォルトは"A new Flutter project."

10. クリーン

Flutterプロジェクト内の一時ファイルやキャッシュをクリーンアップするためのコマンドです。
このコマンドを実行することで、プロジェクトのビルドや実行に関連する一時ファイルやキャッシュ¹が削除され、プロジェクトの状態をリセットすることができます。

flutter clean

11. ライブラリやツールをダウンロードし、プロジェクトに取り込む

pubspec.yaml ファイルに記述された依存関係に基づいてパッケージがダウンロードされ、プロジェクトで利用できるようになります。pubspec.yaml ファイルを更新するたびに実行します。

flutter pub get

12. ライブラリの依存関係をツリーで表示

Flutterプロジェクトの依存関係グラフを表示することができます。このコマンドを実行すると、プロジェクト内の各パッケージがどのように依存し合っているかを可視化して表示します。

flutter pub deps

13. ビルド

ターゲット環境を指定してビルドすることができます。ビルドしたものは./build/⚪︎⚪︎⚪︎に生成されます。

オプション	内容
aar	Android ARchiveファイル
apk	Android APKファイル
appbundle	Android App Bundleファイル
bundle	Flutterのフォントや画像等のバンドルのビルド(flutter_assetsディレクトリ以下, DartのJIT用バイトコード)
ios	iOS向けビルド
ios-framework	.framework向けビルド
web	Webアプリ向け
macos	macOSデスクトップ向け(デフォルトはリリースモードでのビルド)
linux	Linuxデスクトップ向け(デフォルトはリリースモードでのビルド)
windows	Windowsデスクトップ向け(デフォルトはリリースモードでのビルド)

オプションを付けることで、様々な機能が利用できます。

ターゲットアーキテクチャを指定してビルドする

flutter build apk --target-platform=android-arm64

ビルド時のサイズ情報を確認する

flutter build ios --analyze-size
Building macOS application...                                           
▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  sample.app                                                               35 MB
  sample.app/
    Contents/
      _CodeSignature                                                        9 KB
      MacOS                                                                66 KB
      Resources                                                           246 KB
      Frameworks                                                           34 MB
      Dart AOT symbols accounted decompressed size                          3 MB
        package:flutter                                                     2 MB
        dart:core                                                         306 KB
        dart:typed_data                                                   221 KB
        dart:ui                                                           191 KB
        dart:async                                                        115 KB
        dart:collection                                                   110 KB
        dart:convert                                                       58 KB
        dart:isolate                                                       40 KB
        dart:io                                                            38 KB
        package:vector_math                                                33 KB
        dart:developer                                                     10 KB
        package:typed_data/
          src/
            typed_buffer.dart                                               7 KB
        package:collection/
          src/
            priority_queue.dart                                             5 KB
        dart:math                                                           4 KB
        dart:ffi                                                            4 KB
        package:sample/
          main.dart                                                         3 KB
        dart:vmservice_io                                                   2 KB
        dart:mirrors                                                       668 B
        dart:nativewrappers                                                382 B
        Never                                                               63 B
      Info.plist                                                            2 KB
▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒

14. アプリ実行

devicesで表示されているターゲットにビルドからインストールまで一連の作業を実行することができます。

flutter run

リリースモード²で実行する

flutter run --release

デバッグモード³で実行する

flutter run --debug

デバイスIDはflutter devicesで確認した値（左から2列目）です。

# -d　オプションを使用してターゲットデバイスを指定する devicesで表示されているデバイスIDを指定する
flutter run -d (デバイスID)

# 再ビルドなしでアプリを実行する(既にビルド済みの場合のみ)
flutter run --no-build

# アプリ実行中の詳細ログを表示する
flutter run --verbose

15. インストール

ビルド済みのインストールパッケージをデバイスにインストールすることができます。

flutter install

16. ユニットテスト

testディレクトリのユニットテストを実行することができます。

flutter test

16. インテグレーションテスト

アプリのインテグレーションテストを実行することができます。

flutter drive --target=test_driver/sample_perf.dart

17. スクリーンショットを撮る

現在使用しているデバイスのスクリーンショットを撮ることができます。

flutter screenshot # 出力先を指定するには --outオプションを利用します

18. ヘルプメッセージを表示する

コマンドを入力した後に--helpを付与するとそのコマンドに対するヘルプメッセージを表示することができます。

flutter --help
flutter run --help

参考資料

キャッシュ
閲覧した際にデータをパソコン内に一時的に保存して、再度閲覧する際に素早く表示するための機能です。
こちらにわかりやすい記事があったので、是非読んでみてください。 ↩
リリースモード
アプリをリリースする準備ができたときに使用するビルドモードです。リリースしたときのパフォーマンスを確認することができます。
リリースに不要なデバッグ機能等を外してアプリのパフォーマンスが最適化されるので、ホットリロード機能をはじめとするデバッグを行うことはできません。
Android Studio のメニューを使用する場合は、「Run」>「Flutter Run ‘main.dart’ in Release Mode」を押すことで、Release Mode（リリースモード）でのビルドができます。
↩
デバッグモード
開発でバグ修正（デバッグ）するときに使用するビルドモードです。
コードの変更をすぐに反映するホットリロード機能は、このモードでのみ使うことができます。また、ブレークポイントを設定することもできます。
このように、デバッグするための機能が使えるようになっていますが、その分、アプリは最適化されないので、実行速度などパフォーマンスは良くないです。
Android Studio のメニューを使用する場合は、上部にある▷ボタンか、虫マークのボタンを押すことで、Debug Mode（デバッグモード）でのビルドができます。
↩

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up