【Flutter】開発環境のセットアップ手順（M1 Mac編）

M1 Macにまっさらの状態からFlutter開発環境をセットアップする手順のメモです。

IDE（統合開発環境）／エディタ／ブラウザのインストール

まずはFlutter開発用の、IDE（統合開発環境）／エディタ／Chromeブラウザ、を以下のリンク先からインストールします。

Xcode（Mac App Store）
Android Studio（公式ダウンロードページ）
※ダウンロード時の規約への同意画面では必ず【Mac with Apple chip】を選択してください。（【Mac with Intel chip】ではありません）
VSCode（公式ダウンロードページ）
※【↓Mac】ボタンでダウンロードされるのはUniversal版です。そのままでも良いですが、M1 Macならその下にある【.zip [Apple Silicon]】でOKです。
Google Chrome（公式ダウンロードページ）

初回起動時に初期設定や追加インストールが走る場合があるため、インストール後、それぞれ１回起動してください。

次にFlutter SDKをインストールしていきます。

ダウンロード後、解凍したflutterフォルダを任意の場所に配置してください。（ここで配置した場所にパスを通していきます）

Terminalを起動して、vim（エディタ）からPATHを追加します。（シェルはzsh）

vim .zshrc

[i]を押してINSERTモードにしてから、以下の行を追加します。

export PATH="$PATH:[ここにFlutterのPATH]/bin"

# 例：user以下にDeveloperフォルダを作成してflutterフォルダを配置した場合
export PATH="$PATH:/Users/cbtdev/Developer/flutter/bin"

[esc]でINSERTモードを解除し、[:wq!]と入力してvimを終了します。

PATHが通っているか以下のコマンドで確認します。

which flutter

# /Users/cbtdev/Developer/flutter/bin/flutter
# のようにパスが表示されればOK

以下のコマンドでFlutter SDKのインストール状況を確認します。

flutter doctor

❌が３個ほど出ていますので、これらを解消していきます。

Preferencesの[SDK Tools]で以下の項目にチェックを入れてコマンドツールをインストールします。

✅ Android SDK Command-line Tools (latest)

実行すべきコマンドが表示されているので、そのコマンドをそのまま実行します。

flutter doctor --android-licenses

CocoaPodsがインストールされていないので、以下のコマンドでインストールします。

sudo gem install cocoapods

flutter doctor

全て解消されました！

M1 Mac環境でのセットアップ中に問題があった場合、以下の記事が参考になるかもしれません、と公式に記載がありますので、こちらに記載のコマンドを試してみると良いでしょう。

最後に、IDE／エディタに　Flutterプラグインをインストールします。

以上で完了です。