Flutterの開発環境の構築 - IT技術で仕事を減らしたい！

どうも、nippa です。

今回クロスプラットホームアプリケーション開発のための Flutter の開発環境の構築をしたいと思います。

iOS、Andorid 向けのアプリケーション開発を Flutter で行う準備段階になります。

環境
Flutter の環境に必要となるソフトウェア
Flutter のインストール
- Homebrew でのインストール
- Github からインストール
Flutter の環境構築
感想

環境

macOS 12.6
Homebrew 4.1.12
Flutter 3.13

Flutter の環境に必要となるソフトウェア

android-sdk
android-studio
Xcode
CocoaPods

Flutter のインストール

Homebrew でのインストール

Homebrew にも Flutter パッケージがあるので、手軽にインストール可能です。

brew install --cask flutter

Github からインストール

Flutter コマンドをインストールするディレクトリを作成します。

mkdir ${HOME}/local

github からコードを取得します。

cd ${HOME}/local
git clone https://github.com/flutter/flutter.git -b stable

PATH の設定をします。

export PATH="$PATH:${HOME}/local/flutter/bin"

必要に合わせて.zshrc や.bashrc などに PATH を記載してください。

Flutter の環境構築

Flutter の環境に必要なソフトウェアをインストールを確認します。

flutter doctor

必要なソフトウェアがインストールされていない場合は、以下のような出力がされます。

[✗] Android toolchain - develop for Android devices
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
[✗] Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS and macOS
      development.
      Download at: https://developer.apple.com/xcode/download/
      Or install Xcode via the App Store.
      Once installed, run:
        sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
        sudo xcodebuild -runFirstLaunch
    ✗ CocoaPods not installed.
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to
        your plugin usage on the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To install see https://guides.cocoapods.org/using/getting-started.html#installation for
      instructions.

android-sdk（Android toolchain）のインストールと初期設定

今回は、android-studioからインストールします。

brew install --cask android-studio

インストール後、android-stadio からAndroid SDK Command-line Toolをインストールします。

インストール後、以下を実行してライセンスの承諾を行います。

flutter doctor --android-licenses

Xcode のインストール

Mac のapp storeから Xcode をインストールします。

インストール後に、コマンドラインで以下を実行します。

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

sudo xcodebuild -runFirstLaunch

CocoaPods のインストール

CocoaPods のインストールができていな場合で、flutter doctorを実行すると以下のような警告が表示されます。

[!] Xcode - develop for iOS and macOS (Xcode 14.2)
    ✗ CocoaPods not installed.
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to
        your plugin usage on the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To install see https://guides.cocoapods.org/using/getting-started.html#installation for
      instructions.

CocoaPods は Homebrew からインストールできます。

brew install cocoapods

gem を利用している場合は、gem からもインストール可能です。参考：https://cocoapods.org/

sudo gem install cocoapods

flutter doctor で環境のチェック

flutter doctor

でNo issues founded!であることを確認します。

これで環境の準備が整います。

感想

今回 Flutter の開発環境を整いました。

クロスプラットフォームのアプリ開発を進めてみようと思います。

ではでは、また次回。