【Flutter】MacOS Sequoia15.2にFlutter環境を構築(備忘録)
どうもこんにちは、
今まで、モバイルアプリ開発は、主にAndroid javaで開発してました。
そろそろ新しい技術もキャッチアップしたいと思い、iOSやAndroidのマルチプラットフォームの開発ができるFlutterを勉強してみることにしました。
今回は、自PC(MacOS Sequoia15.2)にFlutter環境を構築したので備忘録としてまとめておきます。
目次
Flutter
Flutterの特徴は、以下が挙げられるようです。
・高速な実行速度
・便利な開発機能・・・ホットロードなど。
環境構築
私のMAC(intel)のOSバージョンは以下です。また、すでにAndroidStudioはインストール済です。
・macOS Sequoia15.2
・Android Studio Ladybug | 2024.2.1 Patch3
Flutterのインストール
以下のページからFlutterのSDKをダウンロードします。
Flutter install
私のMacはIntel Processorなので以下をダウンロードしました
ダウンロードしたzipファイルを解凍し、以下に格納しました。
/Users/ユーザー名/development/flutter
SDK内の実行ファイルのパスを通します。
echo "export PATH=\"\$PATH:$HOME/development/flutter/bin\"" >> ~/.zshenv
. ~/.zshenv
Flutterのバージョンを確認してインストールできているか確認します。
flutter --version
以下のような結果が表示されました。Flutterインストールできました。
Flutter 3.27.2 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 68415ad1d9 (6 days ago) • 2025-01-13 10:22:03 -0800
Engine • revision e672b006cb
Tools • Dart 3.6.1 • DevTools 2.40.2
Android toolchainをインストール
Android Studioはすでにインストール済でしたので、Android StudioのSettingsを開きます。
Android SDKの「SDK Tools」タブから、Android SDK Command-line Tools(latest)をインストールします。
ターミナルで以下のコマンドを実行し、インストール状況を確認します。
flutter doctor
以下のようなlicensesのエラーが出ます。
[!] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
! Some Android licenses not accepted. To resolve this, run: flutter doctor
--android-licenses
以下のコマンドを実行して、ライセンスに同意します。
flutter doctor --android-licenses
再度、flutter doctorでインストール状況を確認しました。
Xcodeだけ✗でそれ以外はOKとなりました。
iOS開発環境をインストール
App StoreからまずはXcodeをインストールします。
ターミナルから、以下を実行し関連パッケージをインストールします。
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch
sudo xcodebuild -license
flutter doctorを実行してインストール状況を確認します。
Unable to get list of installed Simulator runtimes.
が出たので、以下でiOS Simulator runtimesをインストールします。
xcodebuild -downloadPlatform iOS
あとは、CocoaPods not installed.なので、インストールしてみます。
brew install cocoapods
flutter doctorを実行して状況見てみます。
ようやくすべてチェックがつきました。
Android Studioの設定
Android StudioからSettingsメニューを開き、Pluginsを開きます。
Marketplaceから「Flutter」と「Dart」をインストールします。
なぜか、Dartがすでにインストール済になっており、何度かAndroidStudioを再起動したり、Flutterプラグインを入れ直したりしてようやくFlutterとDartが入りました。
バージョン管理ソフトfvmのインストール
Flutterのバージョンを管理するソフトfvmをインストールしました。
brew tap leoafarias/fvm
brew install fvm
以下コマンドでFlutterのリリースバージョンを確認します。
fvm releases
最新の安定版は、Ver3.72.2ですので、これをfvmでインストールします。
※最初に、Flutter SDKを手動でインストールしましたが、fvmでバージョン管理したいので、再度インストールしました。
fvm install 3.27.2
fvmからインストールしたFlutter SDKは以下にインストールされたようです。
/Users/inomatakohei/fvm/versions/3.27.2
fvmでインストールしたFlutter SDKを使っていくので、最初に設定したパスを変更します。
~/.zshenvを以下のように変更しました。
[変更前] ※手動でインストールしたSDKのパス
export PATH="$PATH:/Users/inomatakohei/development/flutter/bin"
↓
[変更後] ※fvmでインストールしたSDKのパス
export PATH="$PATH:/Users/inomatakohei/fvm/versions/3.27.2/bin"
~/.zshenvを変更したので以下を実行
. ~/.zshenv
Flutterアプリのサンプルを動かしてみる
Android Studio→New→New Flutter Projectを選択します。
GeneratorでFlutterを選択し、SDKパスは、fvmでインストールしたSDKのパスを記載。
作成したプロジェクトのルートで以下のコマンドを入力して、Flutterのバージョンを指定しました。
fvm use 3.27.2
あとは、Select Deviceで「Open iOS Simulator」を選択すると、iOSシミュレーターが起動します。
起動したシミュレーターを選択し、実行ボタンを押すと、iOSシミュレーターにサンプルアプリがインストールされました。
Androidは、USBで所有のAndroidタブレットを接続し、実行を押すとこちらも無事にインストールされました。
(※Androidシミュレーターは実行が重そうだったので、Androidは実機で確認しました。)
最後に
以上、Flutterの環境環境でした。
結構いろいろ面倒でしたが、これでアプリ開発が試せます。
また勉強した内容はブログにまとめていこうと思います。
それでは!
スポンサーリンク