🌿

Flutterの環境構築手順(MacOS編)

に公開

前提

  • OS:MacOS
  • Flutterを使用してアプリ開発を始めたい方を対象としています。
  • ターミナルを使用する操作が含まれます。

Xcodeのインストール

FlutterでiOSアプリを動かすためには、Xcodeのインストールが必要です。

  1. App Storeを開きます。
  2. 「Xcode」を検索してインストールします。
  3. インストール後、初回起動してライセンス同意や追加コンポーネントのインストールを行います。

ターミナルで以下を実行し、Xcodeコマンドラインツールが利用可能か確認します。

xcode-select -p

未インストールの場合は以下でインストール可能です。

xcode-select --install

Flutterのインストール

  1. Flutter公式サイトから最新版のSDKをダウンロードします。
    👉 Flutter公式ダウンロードページ
  2. ダウンロードした flutter_macos_***.zip を解凍し、任意の場所に配置します(例:~/development/flutter)

Flutterのパスを通す

ターミナルから flutter コマンドを直接使えるようにするため、パスを通す必要があります。
シェルに応じて設定ファイルを編集します。
(zshの場合)~/.zshrc

export PATH="$PATH:$HOME/development/flutter/bin"

設定を反映します。

source ~/.zshrc

flutter doctorコマンドで確認

Flutterのセットアップ状況を確認します。

flutter doctor

出力例

[] Flutter (Channel stable, 3.x.x, on macOS 13.x)
[] Xcode - develop for iOS and macOS
[] Android toolchain - develop for Android devices
[!] Some Android licenses not accepted. ...

警告や不足がある場合は指示に従って解決します。

flutter createコマンドでプロジェクトを作成

新しいFlutterプロジェクトを作成します。

flutter create my_app

作成されたディレクトリに移動します。

cd my_app

flutter runコマンドでプロジェクトの立ち上げ

シミュレーターまたは実機でアプリを起動します。

iOSシミュレーターを起動(Xcodeから開くか、以下コマンドで起動):

open -a Simulator

Flutterアプリを実行します。

flutter run

初期プロジェクトの「カウンターアプリ」が起動すれば成功です!

まとめ

以上で、MacOS上でのFlutter開発環境構築が完了しました。

  • Xcodeの準備
  • Flutter SDKの導入
  • PATHの設定
  • flutter doctorでの確認
  • プロジェクト作成 → 実行

これでFlutterアプリ開発を始められる状態になりました。
👉 次のステップとしては、エディタ(VS CodeやAndroid Studio)の設定を行うと効率よく開発できます。

Discussion