Flutter開発環境構築メモ

## 前提
* Flutterの開発環境を構築した際のメモです。（2022/05/21時点）
* 使用しているPCのOSは Windows 10 Home
* PCのプロセッサは AMD Ryzen 7

## Flutter のインストール

* [Flutter](https://docs.flutter.dev/get-started/install) の公式サイトから Windows を選択し、「flutter_windows_3.0.1-stable.zip」を選択してダウンロード
* 「flutter_windows_3.0.1-stable.zip」を解凍し、任意の場所に置いておく（今回は C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable に配置）
* 「環境変数の編集」から、変数：Path、値：C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable\flutter\bin を設定する
* コマンドプロンプトから、Flutterのパスが正しく設定されていることを確認する
```
>where flutter dart
C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable\flutter\bin\flutter
C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable\flutter\bin\flutter.bat
C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable\flutter\bin\dart
C:\Users\UserName\Flutter\flutter_windows_3.0.1-stable\flutter\bin\dart.bat
```

* flutter doctor を実行して、必要な依存関係ファイルが揃っているか確認する
```
>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.1, on Microsoft Windows [Version 10.0.19043.1706], locale ja-JP)
[X] Android toolchain - develop for Android devices
    X 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/docs/get-started/install/windows#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.

[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[!] Android Studio (not installed)
[√] VS Code (version 1.67.2)
[√] Connected device (3 available)
[√] HTTP Host Availability

! Doctor found issues in 3 categories.
```
全てが[√]になるまで以下のインストールを行う 
## Android Studio 関連のインストール
* Android Studio のインストール
* cmdline-tools;latest のインストール
* Android ライセンスの同意
### Android Studio のインストール
* [Android Studio](https://developer.android.com/studio) の公式サイトから 「Download Android Studio」 を選択し、利用規約の同意にチェックして 「Download Android Studio Chipmunk 2021.2.1 for Windows」を選択してダウンロード
* 「android-studio-2021.2.1.14-windows.exe」を選択してインストール
* インストール完了後にAndroid Studio を起動して、画面に従ってAndroid SDK をセットアップする
* 「次へ」を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/d97a2119-f0e2-badd-3b47-55ca938233da.png)
* 「次へ」を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/a8f6c8d2-4cfa-032a-990d-c73999e0175b.png)
* 「次へ」を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/7b8fe7d2-6d90-44ea-d244-55e56628e725.png)
* 利用規約に同意して「完了」を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/5b36352c-60f0-a194-f1ac-4eafe08452a7.png)
* 「完了」を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/43cd91d7-5115-1c75-27db-8b69aac939f3.png)
* Android Studio のインストール完了
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/5860b6f1-8b69-be64-56fd-5c6a544fc87b.png)

* 再度flutter doctor を実行して確認する
```
>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.1, on Microsoft Windows [Version 10.0.19043.1706], locale ja-JP)
[!] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    X cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    X Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/windows#android-setup for more details.
[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2021.2)
[√] VS Code (version 1.67.2)
[√] Connected device (3 available)
[√] HTTP Host Availability

! Doctor found issues in 2 categories.
```
### cmdline-tools;latest のインストール
* 「cmdline-tools;latest」をインストールする必要があるため、Android Studio のProjects > More Actions > SDK Maneher を選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/ec43eb66-55dc-bd6d-8b6d-1675a99569fb.png)
* SDK Toolsのタブを選択し、「Android SDK Command-line Tools(latest)」にチェックを入れてOKを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/594ec0e5-4238-c9b9-0a4c-05bc0f8b453b.png)
* インストールが終わったら、Finishを選択して完了する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/09f86c35-a251-f931-2e95-913ed0b2f710.png)

* 再度flutter doctor を実行して確認する
```
>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.1, on Microsoft Windows [Version 10.0.19043.1706], locale ja-JP)
[!] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2021.2)
[√] VS Code (version 1.67.2)
[√] Connected device (3 available)
[√] HTTP Host Availability

! Doctor found issues in 2 categories.
```
### Android ライセンスの同意
Android ライセンスの同意するために以下のコマンドを実行する
```
flutter doctor --android-licenses
```

* 再度flutter doctor を実行して確認する
```
>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.1, on Microsoft Windows [Version 10.0.19043.1706], locale ja-JP)
[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[√] Chrome - develop for the web
[X] Visual Studio - develop for Windows
    X Visual Studio not installed; this is necessary for Windows development.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2021.2)
[√] VS Code (version 1.67.2)
[√] Connected device (3 available)
[√] HTTP Host Availability

! Doctor found issues in 1 category.
```

## Visual Studio のインストール
* [Microsoft](https://visualstudio.microsoft.com/downloads/) の公式サイトにアクセスし、コミュニティ > 無料ダウンロード を選択して、インストーラをダウンロード
* 「VisualStudioSetup.exe」を選択して、インストールを行う
* 「C++によるデスクトップ開発」に選択して、インストールを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082287/21609722-3f22-1d04-baf7-e4da0ecfabf5.png)
* 完了したらサインインを求めるので、サインインして完了
* 再度flutter doctor を実行して確認する

## Due to an error, the doctor check did not complete のエラーメッセージが表示された場合
2022/05/21時点で「flutter doctor」を実行した際に、以下のエラーメッセージが表示される
```
[☠] Visual Studio - develop for Windows (the doctor check crashed)
    X Due to an error, the doctor check did not complete. If the error message below is not helpful, please let us know about this issue at https://github.com/flutter/flutter/issues.
    X Exception: Bad UTF-8 encoding (U+FFFD; REPLACEMENT CHARACTER) found while decoding string: [
```

Flutter の [github リポジトリ](https://github.com/flutter/flutter/issues/102451) によると Visual Studio に含まれる vswhere の問題でエラーが生じるので、[github](https://github.com/microsoft/vswhere/releases) から「vswhere.exe」をダウンロードして「C:\Program Files (x86)\Microsoft Visual Studio\Installer」に上書きコピーすると解消される

## flutter doctor を実行して環境構築が完了したか確認する
「flutter doctor」を実行して、すべて[√]が表示したら完了です。 
```
>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.0.1, on Microsoft Windows [Version 10.0.19043.1706], locale ja-JP)
[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Community 2022 17.2.1)
[√] Android Studio (version 2021.2)
[√] VS Code (version 1.67.2)
[√] Connected device (3 available)
[√] HTTP Host Availability

• No issues found!
```
## Flutter と Dart のプラグインを Android Studio にインストール
* Plugins から Marketplace タブから Flutter と検索して Install を選択し、完了したら再起動する
※Flutter のプラグインをインストールすると、Dart のプラグインもインストールされます

## Android Studioの日本語化
https://qiita.com/kosh1/items/e8d9a312299aff3261ca