Flutter 1.7.x 環境をmacOS上に構築する


# なぜこの文章を書いているか？

[この文章（Flutter 1.2.x 環境をmacOS上に構築する）](https://qiita.com/uehatsu/items/d73e761935dde44f1fb8)を過去に書き間が空いたのと再度Flutterを触り始めたので環境をまっさらな状態から作り直した作業ログとしてまとめたのが以下です。最近はLaravelとかNuxt.jsとかTypeScriptとかいじってますが、そろそろ他のものもということで。
今回はできる限り公式サイトの順番で環境を作っていこうと思います。
https://flutter.dev/docs/get-started/install/macos

# 環境（2019/08/30（金）現在）

- macOS Mojave(10.14.6)
- Xcode 10.3
- IntelliJ IDEA Ultimate 2019.2.1
- Flutter 1.7.8 + Hotfix 4 Stable

# インストール
## Tools
公式サイトに書かれている必須ツールは以下の通り。

- bash
- curl
- git 2.x
- mkdir
- rm
- unzip
- which

このうち、macOS Mojaveに標準で入っていないのは`git`なのでインストールする。

```bash:command
$ xcode-select --install
```

「"xcode-select"コマンドを実行するには、コマンドライン・デベロッパ・ツールが必要です。ツールを今すぐインストールしますか？」とウィンドウが表示されたら`インストール`をクリック。
「Command Line Tools使用許諾契約」画面が表示されたら内容を読んだ上で`同意する`をクリック。

インストールが完了したら以下でバージョンが表示されればOK。

```bash:command
$ git --version
git version 2.20.1 (Apple Git-117)
```

## Flutter SDKのインストール

公式サイトの`flutter_macos_v1.7.8+hotfix.4-stable.zip`と書かれている青いボタンをクリックしてZipファイルをダウンロードします。
ダウンロードしたら、`~/development`以下に展開します。

```bash:command
$ mkdir ~/development
$ cd ~/development
$ unzip ~/Downloads/flutter_macos_v1.7.8+hotfix.4-stable.zip
```

`~/development/flutter/bin/`が作られるのでPATHを通します。

```bash:command
$ echo 'export PATH=$PATH:~/development/flutter/bin' >> ~/.profile
$ exec $SHELL -l
```

以下でバージョン情報が表示されればOK。

```bash:command
$ flutter --version
Flutter 1.7.8+hotfix.4 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 20e59316b8 (6 weeks ago) • 2019-07-18 20:04:33 -0700
Engine • revision fee001c93f
Tools • Dart 2.4.0
```

以下でバイナリをダウンロード（キャッシュ）しておきます。瞬間で終わるので実際に何か行われている感じはしないのですが、念の為。

```bash:command
$ flutter precache
```

Flutterの実行に必要な環境が揃っているか以下でチェックします。
途中「"gen_snapshot"はこのMac用に最適化されていないため、アップデートが必要です。」と出ますので`OK`をクリックします。

```bash:command
$ flutter doctor -v
[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Mac OS X 10.14.6 18G95, locale
    ja-JP)
    • Flutter version 1.7.8+hotfix.4 at /Users/foobar/development/flutter
    • Framework revision 20e59316b8 (6 weeks ago), 2019-07-18 20:04:33 -0700
    • Engine revision fee001c93f
    • Dart version 2.4.0

[✗] 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
    ✗ 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:
        brew install cocoapods
        pod setup
    ! Brew can be used to install CocoaPods.
      Download brew at https://brew.sh/.

[✗] iOS tools - develop for iOS devices
    ✗ libimobiledevice and ideviceinstaller are not installed. To install with
      Brew, run:
        brew update
        brew install --HEAD usbmuxd
        brew link usbmuxd
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
    ✗ ios-deploy not installed. To install:
        brew install ios-deploy
    ! Brew can be used to install tools for iOS device development.
      Download brew at https://brew.sh/.

[!] Android Studio (not installed)
    • Android Studio not found; download from
      https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/setup/#android-setup for detailed
      instructions).

[!] Connected device
    ! No devices available

! Doctor found issues in 5 categories.
```

色々と未インストール（環境未整備）だと怒られているので順に入れていきます。

## Xcodeをインストール

`App Store`を起動し、検索窓に`xcode`と入力して検索しインストールします。時間がかかるので私は一晩寝かしました。

すでにコマンドラインツールはインストール済みですが、公式ドキュメントのとおりにインストールしたXcodeから設定しておきます。

```bash:command
$  sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
```

Xcodeのライセンス承諾を行うために以下のコマンドを実行します。Enterを押した後、Spaceキーで最後まで読み、入力を求められたら`agree`とキー入力してEnterを押してライセンス条項に対し承諾をします。

```bash:command
$ sudo xcodebuild -license
```

この状態で以下のコマンドが実行できgitのバージョンが表示されればOKです。

```bash:command
$ git --version
git version 2.20.1 (Apple Git-117)
```

## iOSシミュレータの設定

以下のコマンドを実行しiOSシミュレータを起動します。

```bash:command
$ open -a Simulator
```

`Hardware` > `Device` > `Manage Devices`を選択し、「Install additional required components?」画面が出たら`Install`をクリックし、パスワードの入力画面が出るのでMacのアカウントのパスワードを入力し`OK`をクリックします。

インストールが起動したらXcodeが起動するので、一旦iOSシミュレータを終了して再度起動します。私の環境ではiPhone XRのシミュレータが自動的にスタートしました。公式ドキュメントには「64bitのiPhone5S以降をセットアップしてね」とありますが現在のiOSシミュレータではこれ以上特に作業は必要ありません。

## テストアプリを作ってみる

公式ドキュメントではここで唐突にテストアプリを作る項目が出てきます。iOSシミュレータがセットアップできているかなどのチェック用でしょうか？ここでは言われたとおりに作ってみることにします。

ターミナルで適当な場所に作業用ディレクトリを作成し、そこで作業を進めます。

```bash:command
$ mkdir ~/development/project
$ cd ~/development/project
$ flutter create my_app
$ cd my_app
$ flutter run
No connected devices.

Run 'flutter emulators' to list and start any available device emulators.

If you expected your device to be detected, please run "flutter doctor" to
diagnose
potential issues, or visit https://flutter.dev/setup/ for troubleshooting tips.
```

怒られました。どうやらiOSシミュレータを終了していたためのようです。iOSシミュレータを起動しiPhone XRのシミュレータが起動している状態でもう一度`flutter run`を実行してみます。
`Flutter Demo Home Page`という画面がシミュレータに表示されればOKです。ターミナルで`q`を入力するとアプリが終了します。

## iOSデバイス（実機）にデプロイするための設定

[Homebrew](https://brew.sh/index_ja)をインストールするように書かれているのでそのとおりにします。Qiitaを読んでらっしゃるMacユーザならインストール済みと思われますので（偏見）説明は省きます。

```bash:command
$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
$ brew update
```

iOSデバイス（実機）にデプロイするために必要なツール群を`brew`コマンドを使ってインストールしていきます。私の環境では`brew link usbmuxd`で「リンク済み」の旨のメッセージが出ましたが特に問題ないと思われます。

```bash:command
$ brew install --HEAD usbmuxd
$ brew link usbmuxd
$ brew install --HEAD libimobiledevice
$ brew install ideviceinstaller ios-deploy cocoapods
$ pod setup
```

先ほど作ったテストアプリをiOSデバイスにデプロイできるようにするためにプロジェクトにサインをします。基本公式ページのとおりですが簡単にまとめます。

1. ターミナルで`open ios/Runner.xcworkspace`としてXcodeを開きます
2. iOSデバイスをMacに接続して「信頼するか？」など聞かれたら通常の方法でMacとiOSデバイスが通信できる状態にします
3. Xcodeの左上のプルダウンが`Runner > iPhone XR`となっていたら、プルダウンをクリックして接続したiOSデバイスを選択します
4. 左ペインの一番上にある`Runnerプロジェクト`をクリックして選択します
5. Xcode 9と10は真ん中のペインの`General > Signing > Team`を、Xcode 11は`Signing & Capabilities > Team`にある`Team`メニューに自分のチーム（Apple ID）を設定します
6. 自分の環境では「You currently don't have access to this membership resource. To resolve this issue, agree to the latest Program License Agreement in your developer account.」と出ていたので[Dev Center](https://developer.apple.com/devcenter/ios/index.action)にアクセス、その後`account`にメニューから移動し「The Apple Developer Program License Agreement has been updated.」と赤背景でメッセージが出ているところから「Review Agreement」をクリック、内容を確認しチェックボックスをチェック、「I Agree」ボタンをクリック、最後にXcodeに戻ってエラーメッセージの下の「Try again」ボタンをクリックしました
7. iOSシミュレータを終了した上でターミナルから`flutter run`を実行
8. 先ほどと同じ`Flutter Demo Home Page`がiOSデバイスで表示されたらOKです

## Android Studioの代わりにIntelliJ IDEA Ultimateをインストールする

公式サイトではAndroid Studioをインストールしていますが、私はIntelliJ IDEAを普段使っているのでそちらで利用可能なように設定します。

まず、`Homebrew Cask`を使って`JetBrains ToolBox`をインストールします。

```bash:command
$ brew cask install jetbrains-toolbox
```

Applicationから`JetBrains ToolBox`を起動し、`JetBrainsアカウント`でログイン後、IntelliJ IDEA Ultimateをインストールします。
インストールが終わったらIntelliJ IDEAを起動します。初期設定の時にAndroid開発の追加インストールがされているはずですので、Welcome画面から`Create New Project`を選択し、`New Project`画面で`Android`を選択すると`Configure Android SDK`画面が表示されるので`Install SDK`ボタンをクリックします。
`Next`をクリックしていき最後に`Finish`をクリックすると`${USER_HOME}/Library/Android/sdk/`以下に`Android SDK`がインストールされます。`Choose your project`画面に戻ったら今回は`cancel`をクリックしてキャンセルします。

## Androidデバイスの設定

公式ページを見ながら順に設定していきます。

1. Androidデバイスの`開発者オプション`と`USBデバッグ`を有効にします。デバイスやOSのバージョンによりますが通常はビルド番号を何回かタップすると`開発者オプション`が有効になり、`設定 > システム > 開発者オプション`から`UDBデバッグ`のオン・オフができます
2. USBケーブルでMacとAndroidデバイスを接続します。
3. ターミナルで`fultter devices`を実行して接続したデバイスが`1 connected device:`などと表示されればOKです。表示されない場合や`Device XXXXXXXX is not authorized.`と出ている場合は再接続やデバイスの認証、USB設定などを見直してみてください

この状態でターミナルからIntelliJ IDEAを起動し、Androidデバイスにデプロイしてみます。以下でターミナルから開けない場合は手動で`~/development/project/my_app/android`をIntelliJ IDEAで開きます。

```bash:command
$ cd ~/development/project/my_app
$ idea ./android
```

最初はプロジェクトのインデックスに時間がかかります。インデックスが終わると私の環境では２つwarningが出ました。

- Warning: License for package Android SDK Build-Tools 28.0.3 not accepted.
- Warning: License for package Android SDK Platform 28 not accepted.

ライセンスについて承諾していないのが理由のようです。色々と調べると`Android SDK`の`sdkmanager`で承諾することができそうです。とりあえず実行してみます。

```bash:command
$ ~/Library/Android/sdk/tools/bin/sdkmanager --licenses
No Java runtime present, requesting install.
```

おっとJava runtimeのインストールがまだでした。宗教上の理由でanyenvを使います。

```bash:command
$ brew install anyenv
$ anyenv install --init
$ echo 'eval "$(anyenv init --no-rehash -)"' >> ~/.profile
$ exec $SHELL -l
$ anyenv install jenv
$ exec $SHELL -l

$ brew tap caskroom/versions
$ brew cask install adoptopenjdk8
$ jenv add $(/usr/libexec/java_home -v 1.8)
$ jenv global 1.8
$ java -version
openjdk version "1.8.0_222"
OpenJDK Runtime Environment (AdoptOpenJDK)(build 1.8.0_222-b10)
OpenJDK 64-Bit Server VM (AdoptOpenJDK)(build 25.222-b10, mixed mode)
```

もう一度`sdkmanager`を起動します。

```bash:command
$ ~/Library/Android/sdk/tools/bin/sdkmanager --licenses
```

色々とライセンスの承諾を聞かれるので`y`を入力していきます。
最後に`All SDK package licenses accepted`と出ればOKです。

`Build`タブから`Build`を再実行してみると`android:successful`となりWarningは消えました。

`Run > Edit configurations...`を選択し、左上の`+`をクリックして`Android App`を選択します。`Name`を`my_app`に変更、`Module`に`app`を選択し`Apply`、`OK`をクリックして画面を閉じます。
`Run > Run 'my_app'`を選択すると、どのデバイスをビルドターゲットにするか聞かれるのでUSBで接続したAndroidデバイスを選択し`OK`をクリックするとビルドが始まり、自動的にデバイスにデプロイされ、テストアプリが起動します。

## Androidエミュレータの設定

IntelliJ IDEAからAndroidエミュレータが動作するように設定します。

1. `Tools > Android > AVD Manager`を選択
2. `+ Create Virtual Device...`をクリック
3. `Phone > Nexus 5X`を選択し`Next`をクリック
4. `Pie`の隣の`Download`をクリックし`Pie`をインストールします
5. `Pie`のインストールが終了したら`Finish`をクリック
6. 改めて`Pie`を選択し`Next`をクリック
7. `Finish`をクリック
8. `ADV Manager`を一旦閉じ、`Run > Run 'my_app'`を選択
9. `Select deployment target`画面に`Nexus 5X`があるので選択して`OK`をクリック
10. エミュレータが自動で起動します
11. エミュレータが起動すると自動的にデプロイされ、テストアプリが起動します

## 落ち穂拾い

`fultter doctor -v`を実行して問題を確認します。

```bash:command
$ flutter doctor -v
（中略）

[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
    • Android SDK at /Users/foobar/Library/Android/sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-29, build-tools 29.0.2
    • Java binary at: /Library/Java/JavaVirtualMachines/adoptopenjdk-12.0.2.jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment AdoptOpenJDK (build 12.0.2+10)
    ✗ Android license status unknown.
      Try re-installing or updating your Android SDK Manager.
      See https://developer.android.com/studio/#downloads or visit https://flutter.dev/setup/#android-setup for detailed instructions.

（中略）

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/setup/#android-setup for detailed instructions).

[!] IntelliJ IDEA Ultimate Edition (version 2019.2.1)
    • IntelliJ at /Users/foobar/Applications/JetBrains Toolbox/IntelliJ IDEA Ultimate.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.dev/intellij-setup/#installing-the-plugins

（中略）

! Doctor found issues in 3 categories.
```

`Android SDK`のライセンスが不明ということなので、`flutter doctor --android-license`を実行してみます。

```bash:command
$ flutter doctor --android-licenses
All SDK package licenses accepted.
```

`Android Studio`はわざといれていないのでここでは無視します。

`IntelliJ IDEA`に`Flutter`と`Dart`のプラグインが入っていないと言われているのでインストールしてIntelliJ IDEAをリスタートします。

もう一度`flutter doctor -v`を実行します。

```bash:command
$ flutter doctor -v
（中略）
[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/setup/#android-setup for detailed instructions).
（中略）
! Doctor found issues in 1 category.
```

`Android Studio`以外のエラーが消えました。これで開発環境が揃ったことになります。

#　まとめ

前回のインストールログをまとめてから、ちょっとしたサンプルプログラムを作っただけだったので、今度はもうちょっとちゃんとしたものを作りたいなぁと考えています(^^;