Flutter をMacに導入

はじめに

flutterの導入
macにインストールしてアプリ起動まで

SDKのダウンロード

Flutter 公式ページ
https://flutter.dev/docs/get-started/install/macos

ここから最新のSDKをダウンロードして解凍したファイルを任意のディレクトリに配置
ここではホームディレクトリ配下とする

pathを通す

flutterコマンドを使用できるようにするため、解凍したファイルのbinフォルダまでpathを通す

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

環境確認

flutterには環境構築に必要なものが入っているかを表示するコマンドが存在する

$ flutter doctor

上コマンドを叩く問題なければ以下の結果が表示される

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.3, on Mac OS X 10.15.6 19G73 darwin-x64, locale
    ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.1)
[✓] VS Code (version 1.56.2)
[✓] Connected device (1 available)

• No issues found!

これで問題が存在するときは[!][x]が表示されるので解消する

一部項目の対処方法

• Android toolchain & Android Studio

Android Studioのインストール

Android Studio > Preferences > Plugins
から「Flutter」と「Dart」をインストール

• Xcode

XcodeとCocoaPodsのインストール

• VSCode

VSCodeのインストール+拡張機能でFlutterプラグインを導入

プロジェクトの作成

ここまできたら動かせる準備ができてると思うので
作業ディレクトリに移動して

$ flutter create my_app
$ cd my_app
$ flutter run

• flutter create ${プロジェクト名}

プロジェクトの枠組みが作成される。
上コマンドでは作業ディレクトリにmy_appが作成される

• cd ${プロジェクト名}

コマンドで起動するにはFlutterプロジェクトに移動する必要がある

• flutter run

起動状態にあるデバイスで実行が行われる
起動状態デバイスが複数存在するときは選択状態待機になる
※VSCode上では右下からデバイスを選択してからrunするほうがよい