初めてのFlutter環境構築(MacOS Catalina)
まえがき
こんにちははじめまして。アウトプットと後学のためにこれからQiitaを書いていこうと思います。 初めての今回はFlutter環境構築の話です。 たくさんの方が同じような記事を書いてますがご容赦ください。やったこと
参考にしたのはFluutter公式とこちらのQiitaの記事です。
https://qiita.com/_asa08_/items/b321c0c76719cfebf774
以下のFlutter公式サイトからzipをDLします。
https://flutter.dev/docs/get-started/install/macos
DLしたらファイルを解凍し任意の場所に置きます。
(私はdeveloperフォルダを作りその下に作成しました。)
ターミナルでPATHを通します。
$ export PATH="/Users/ユーザー名/developer/flutter/bin"
そしてここからがかなり苦戦しました。
flutter doctorというコマンドを叩きます(6つの項目からなにが足りないとか解決方法を教えてくれます。便利!)
$ flutter doctor
そうすると
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 1.20.2, on Mac OS X 10.15.6 19G2021, locale ja-JP)
[✗] Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/setup/#android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, set ANDROID_HOME to that location.
You may also want to add it to your PATH environment variable.
[✗] Xcode - develop for iOS and macOS
✗ Xcode installation is incomplete; a full installation is necessary for iOS 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:
sudo gem install cocoapods
[!] Android Studio (not installed)
[!] VS Code (version 1.41.1)
✗ Flutter extension not installed; install from
https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
[!] Connected device
! No devices available
このような形で教えてくれます。
上から順に解決していきました。
Andoroid toolchainはとりあえずAndroid Studioを入れろと言われているので
Android Studioをインストールします。
以下のサイトからAndroid Studioインストールしてください。
https://developer.android.com/studio?hl=ja
インストールが終了したら
Android Studioを立ち上げ
メニュー→Android Studio→Preference→Pluginでflutterを検索しインストールします。
SDKToolsをインストールすると参考にしたサイトはあるんですが私の場合は最初からインストールされてました。
Android Studioにflutterをインストールしたら
ターミナルでflutter doctor --android-licensesを入力
$ flutter doctor --android-licenses
続いてXcodeの設定です。CocoaPodsの設定をする前にXcodeのアップデートを必ずしておきましょう。
私は更新せずにCocoaPodsを入れようとしたら何故か上手くいきませんでした。←これを解決するのに時間が無駄にかかった。
アップデートが完了したらターミナルでcocapodsをインストールします。
$ sudo gem install cocoapods
インストールが終了したら
$ pod setup
でセットアップします。
これでほとんどの設定は完了です。
VSCodeのエラーが出てない人はおそらくVSCodeをインストールしていない人なので無視してOKです。
VSCodeのプラグインでflutterをインストールしてあげて
$ open -a Simulator.app
でシミュレーターを立ち上げます。
これでもう一度
$ flutter doctor
を叩くとうまくいけば
Welcom to flutter
と出てくるのでセットアップ終了です!
CocoaPodsがうまくインストールできずbashに戻してみたり色々やって結構時間がかかってしまいましたが無事インストールできました。