WindowsPCにfvmを使用したFlutter開発環境を構築し、実機デバッグまで持っていく備忘録

Flutterに関する一切をインストールしてないPCに対し、開発環境の構築を行う機会があったので一通りの手順について備忘録としてまとめました。

2年くらい前に初めてFlutterに触れた際はAndroidStudioをインストールしてPC内にAVDを使ったデバッグ環境を整えたりしたのですが、スペック不足が原因か動作がもっさりしてて動作確認がとりづらく、後に実機を使用したデバッグのみを使うようになったため、今回はAndroidStudio周りの手順を端折った手順となりました。

私自身について、Flutterを使ったアプリをGooglePlayに1本公開はしたことがあるものの仕事などでは使ったことがなく、また、Flutterのアプリ開発におけるアーキテクチャの話題についていけないレベルです。。

`※いくつかの手順についてうまく行かずに右往左往している内容も載せているためご注意ください`

`※2023/12/20 追記いたしました。以下に記載した情報について部分的に誤りがあるかもしれないためご注意ください。。`:cold_sweat:

`※2023/12/21 JDK21→JDK17に乗り換える対応について追記いたしました。。`:sob:

## 環境情報とか

|項目|内容|
|---|---|
|OS|Windows 11 Pro|
|エディション|22H2|
|CPU|i7-1165G7|
|メモリ|16GB|
|PowerShell|5.1.22621.2506|
|エディタ|VSCode|

`※Gow、Clinkをインストールしているため手順の中にWindows標準では使えないコマンドがいくつかあります（whichとか）。`

- [bmatzelle/gow: Unix command line utilities installer for Windows.](https://github.com/bmatzelle/gow)
- [Clink](http://mridgers.github.io/clink/)

## 構築手順

fvmをインストールするのに`choco`というコマンドが使える必要があるとのこと。調べたところ[Chocolatey](https://chocolatey.org/)というパッケージマネージャでした。

### 1. Chocolateyインストール
[公式のInstallationページ](https://chocolatey.org/install)を見ながら作業しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/eeafb750-8ab3-3685-8764-00900274d3d5.png)

`Get-ExecutionPolicy`コマンドで取得できる実行ポリシーと呼ばれる値が`Restricted`の場合は、`Set-ExecutionPolicy`コマンドで別の状態に変更したうえで実行する必要があるようです。
こちらは私の環境では、別の作業の中で既に`RemoteSigned`となっている状態だったので不要でした。

```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> Get-ExecutionPolicy
RemoteSigned

PS C:\WINDOWS\system32> Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))

PS C:\WINDOWS\system32> choco -v
2.2.2
```

Chocolateyについてバージョン`2.2.2`がインストールできました。

### 2. fvmインストール
こちらも[公式のInstallationページ](https://fvm.app/docs/getting_started/installation)を見ながら作業しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/7883fb70-a74d-fd49-50b1-380f81568c5f.png)

```winbatch:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> choco install fvm
Chocolatey v2.2.2
Installing the following packages:
fvm
By installing, you accept licenses for the packages.
Progress: Downloading dart-sdk 2.17.5... 100%

dart-sdk v2.17.5 [Approved]
dart-sdk package files install completed. Performing other installation steps.
The package dart-sdk wants to run 'chocolateyInstall.ps1'.
Note: If you don't run this script, the installation will fail.
Note: To confirm automatically next time, use '-y' or consider:
choco feature enable -n allowGlobalConfirmation
Do you want to run the script?([Y]es/[A]ll - yes to all/[N]o/[P]rint): A

PATH environment variable does not have C:\tools\dart-sdk\bin in it. Adding...
PATH environment variable does not have C:\Users\[私のユーザー名]\AppData\Roaming\Pub\Cache\bin in it. Adding...
Downloading dart-sdk 64 bit
  from 'https://storage.googleapis.com/dart-archive/channels/stable/release/2.17.5/sdk/dartsdk-windows-x64-release.zip'
Progress: 100% - Completed download of C:\Users\[私のユーザー名]\AppData\Local\Temp\dart-sdk\2.17.5\dartsdk-windows-x64-release.zip (182.12 MB).
Download of dartsdk-windows-x64-release.zip (182.12 MB) completed.
Hashes match.
Extracting C:\Users\[私のユーザー名]\AppData\Local\Temp\dart-sdk\2.17.5\dartsdk-windows-x64-release.zip to C:\tools...
C:\tools
Environment Vars (like PATH) have changed. Close/reopen your shell to
 see the changes (or in powershell/cmd.exe just type `refreshenv`).
 The install of dart-sdk was successful.
  Software installed to 'C:\tools'
Progress: Downloading fvm 2.4.1... 100%

fvm v2.4.1 [Approved]
fvm package files install completed. Performing other installation steps.
Fetching Dart dependencies...
Building executable...
Info: Compiling with sound null safety
Generated: c:\programdata\chocolatey\lib\fvm\bin\fvm.exe
Added C:\ProgramData\chocolatey\bin\fvm.exe shim pointed to '..\lib\fvm\bin\fvm.exe'.
 ShimGen has successfully created a shim for fvm.exe
 The install of fvm was successful.
  Software install location not explicitly set, it could be in package or
  default install location of installer.

Chocolatey installed 2/2 packages.
 See the log for details (C:\ProgramData\chocolatey\logs\chocolatey.log).

PS C:\WINDOWS\system32> fvm --version
2.4.1
```

fvmについてバージョン`2.4.1`がインストールできました。
途中のスクリプトを実行するかという質問は `[A]ll - yes to all` を選択しています。

### 3. fvmでFlutterSDKインストール
fvmインストール直後の状態でインストール済みのFlutterSDKが存在しないことを確認
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm list

No SDKs have been installed yet. Flutter. SDKs installed outside of fvm will not be displayed.
```

そのままPowerShellでFlutterSDKについてインストール可能なバージョンを確認
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm releases
~~~省略~~~
Nov 27 23  │ 3.16.1
Nov 29 23  │ 3.17.0-0.0.pre
Nov 30 23  │ 3.16.2
Dec 5 23   │ 3.18.0-0.1.pre
Dec 6 23   │ 3.16.3
--------------------------------------
Dec 13 23  │ 3.16.4            stable
--------------------------------------
--------------------------------------
Dec 14 23  │ 3.18.0-0.2.pre    beta
--------------------------------------
```

今回は別の開発環境と同じ`3.16.3`をインストール
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm install 3.16.3
Flutter "3.16.3" is not installed.

Installing version: 3.16.3...
Cloning into 'C:\Users\[私のユーザー名]\fvm\versions\3.16.3'...
remote: Enumerating objects: 485071, done.
remote: Counting objects: 100% (42464/42464), done.
remote: Compressing objects: 100% (1652/1652), done.
remote: Total 485071 (delta 41519), reused 40816 (delta 40808), pack-reused 442607
Receiving objects: 100% (485071/485071), 223.50 MiB | 16.17 MiB/s, done.
Resolving deltas: 100% (376618/376618), done.
Updating files: 100% (7854/7854), done.
HEAD is now at b0366e0a3f [flutter_releases] Flutter stable 3.16.3 Framework Cherrypicks (#139618)
Checking Dart SDK version...
Downloading Dart SDK from Flutter engine ...
Expanding downloaded archive with PowerShell...
Building flutter tool...
Running pub upgrade...
Resolving dependencies...
Got dependencies.
Flutter 3.16.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision b0366e0a3f (10 days ago) • 2023-12-05 19:46:39 -0800
Engine • revision 54a7145303
Tools • Dart 3.2.3 • DevTools 2.28.4
```

インストール前に確認した`fvm list`のコマンドで今度はインストールしたバージョンを確認できました
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm list
Cache Directory:  C:\Users\[私のユーザー名]\fvm\versions

3.16.3
```

続けてfvmで扱うFlutterのグローバルなバージョンについて今しがたインストールした`3.16.3`を設定
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm global 3.16.3
Flutter "3.16.3" has been set as global
However your "flutter" path current points to:

.
to use global Flutter SDK through FVM you should change it to:
```

`fvm list`のコマンドで表示されるバージョンの右となりに`(global)`という表示が追加されました
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm list
Cache Directory:  C:\Users\[私のユーザー名]\fvm\versions

3.16.3 (global)
```

`fvm flutter --version`、`fvm dart --version`からグローバル設定したFlutterとDartSDKのバージョンが確認できました
```powershell:PowerShell(管理者として実行)
PS C:\WINDOWS\system32> fvm flutter --version
Flutter 3.16.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision b0366e0a3f (10 days ago) • 2023-12-05 19:46:39 -0800
Engine • revision 54a7145303
Tools • Dart 3.2.3 • DevTools 2.28.4

PS C:\WINDOWS\system32> fvm dart --version
Dart SDK version: 3.2.3 (stable) (Tue Dec 5 17:58:33 2023 +0000) on "windows_x64"
```

### 4. Flutterのプロジェクト作成
`※ここからはVSCode側のターミナル(cmd)で作業しています`
`※また、開発者モードを有効化し、USBデバッグをONにしたAndroidの端末をUSB接続しています`

Flutterの新規プロジェクト作成
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter> fvm flutter create flutter3_example       
Downloading Material fonts...                                      333ms
Downloading Gradle Wrapper...                                      131ms
Downloading package sky_engine...                                   77ms
Downloading flutter_patched_sdk tools...                           286ms
Downloading flutter_patched_sdk_product tools...                   196ms
Downloading windows-x64 tools...                                 2,227ms
Downloading windows-x64/font-subset tools...                        71ms
Creating project flutter3_example...
Resolving dependencies in flutter3_example...
Got dependencies in flutter3_example.
Wrote 129 files.

All done!
You can find general documentation for Flutter at: https://docs.flutter.dev/
Detailed API documentation is available at: https://api.flutter.dev/
If you prefer video documentation, consider: https://www.youtube.com/c/flutterdev

In order to run your application, type:

  $ cd flutter3_example
  $ flutter run

Your application code is in flutter3_example\lib\main.dart.

Could not parse java version from: 

If there is a version please look for an existing bug https://github.com/flutter/flutter/issues/ and if one does not exist file a new issue.


C:\workspace_flutter> cd flutter3_example
```

VSCodeのエディタで見るとこんな感じのフォルダ構成となっていました

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/5af652d9-b312-745e-a460-e824109ac892.png)

#### ちなみに
先にGitHubでソースコード管理用の空リポジトリを作っていて、そのリポジトリをローカルにクローンした状態で新規プロジェクトを作る際、`fvm flutter create .`のような感じでドットを入力することでカレントディレクトリにプロジェクトを作成できます。
ただしこの操作の場合、プロジェクト名について親のフォルダ名を元に設定しようとし、規則に沿わない状態だとエラーを吐いてしまいます。`--project-name`オプションでDartのパッケージ名に沿う形の名称を併せて渡す必要があります。

```winbatch:カレントへのプロジェクト作成に失敗
C:\workspace_flutter\flutter3-hoge> fvm flutter create .
"flutter3-hoge" is not a valid Dart package name.

The name should be all lowercase, with underscores to separate words, "just_like_this".Use only basic Latin letters and Arabic digits: [a-z0-9_].Also, make sure the name is a valid Dart identifier—that it doesn't start with digits and isn't a reserved word.
See https://dart.dev/tools/pub/pubspec#name for more information.
Try "flutter3_hoge" instead.
```

```winbatch:カレントへのプロジェクト作成に成功
C:\workspace_flutter\flutter3-hoge> fvm flutter create . --project-name flutter3_hoge
Creating project ....
Resolving dependencies...
Got dependencies.
Wrote 129 files.

All done!
~~~省略~~~
```

### 5. FlutterのVSCode用の拡張機能をインストール
VSCodeに対し、以下の拡張機能をインストールしました。
- [Dart-Code.flutter](https://dartcode.org/)
- [Dart-Code.dart-code](https://dartcode.org/)
- [alexisvt.flutter-snippets](https://marketplace.visualstudio.com/items?itemName=alexisvt.flutter-snippets)
- [mathiasfrohlich.Kotlin](https://marketplace.visualstudio.com/items?itemName=mathiasfrohlich.Kotlin)

`Dart-Code.flutter`をインストールしたら`Dart-Code.dart-code`の方もインストールされたような気がします。
`mathiasfrohlich.Kotlin`は以前の環境でインストールしてたのでインストールしましたがFlutterの開発を仕掛かるのには不要かもしれません。。

### 6. fvmに関するVSCode用の設定
現在はFlutterについてグローバルインストール中の`3.16.3`と一致していますが、後々別のアプリケーションを別のバージョンで開発し始めたときのためにも、このプロジェクトで使用するFlutterのバージョンがいくつなのかをわかるようにする設定を実施します。
`※以下のコマンドについて管理者で実行しないとFlutterSDKへのショートカットが生成されませんでした。。`
```winbatch:cmd(VSCodeのターミナルで実行、失敗してるので注意)
C:\workspace_flutter\flutter3_example> fvm use 3.16.3

Seems you don't have the required permissions on C:\Users\[私のユーザー名]\fvm On Windows FVM requires to run as an administrator or turn on developer mode: https://bit.ly/3vxRr2M
```

```winbatch:cmd(別途管理者として起動したcmdから実行、成功)
C:\workspace_flutter\flutter3_example> fvm use 3.16.3
Project now uses Flutter [3.16.3]
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/7b0a40aa-5c30-962c-a18c-56b0f4a96a91.png)

このコマンドについて正常に実行できると実行したカレントに`.fvm`というフォルダが生成されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/a45ede5c-3cf3-0585-2c61-859eb022f1ed.png)

中をのぞくと`fvm_config.json`の中にはFlutterSDKのバージョンが書いてあり、`flutter_sdk`というフォルダは↑の手順でインストールしたFlutterSDKへのショートカットとなっていることがわかります。
FlutterSDKのショートカットはfvmをインストールしたユーザーごとにパスが異なるため.gitignoreで除外設定し、`fvm_config.json`のみをGit管理します。
```diff:.gitignore
~~~省略~~~
# Obfuscation related
app.*.map.json

# Android Studio will place build artifacts here
/android/app/debug
/android/app/profile
/android/app/release

+# for fvm config
+.fvm/flutter_sdk
```

次に、FlutterSDK（`.fvm/flutter_sdk`）についてVSCodeがSDKを参照するためのパスの設定を行います。
具体的にはVSCodeのプロジェクトごとの設定ファイル（`.vscode/settings.json`）で以下の設定を作成します。
```json:.vscode/settings.json
{
    "dart.flutterSdkPath": ".fvm/flutter_sdk"
}
```

ここまでの手順を済ませた状態で`lib/main.dart`を開いた際に、コードがハイライト表示されてたり、適当なウィジェットにカーソル当てたときに説明が表示されていれば拡張機能周りは問題ないかなと思います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/4d7ff9ef-df86-dc77-e77a-9f8ba5a6e3f5.png)


### 7. 実機デバッグ(失敗)
`※こちらの章より後の作業内容について、非常に長くなってしまい最終的なナレッジとして見たときに不要な情報も含んでいると思います。。考え方によってはエラーが起きたときのトラブルシュート的な内容になっているかもと思い、そのまま過程も残しています。`

---
実機デバッグを行うにあたりデバイス名を調べます。
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter devices        
Found 3 connected devices:
  Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.22621.2861]
  Chrome (web)      • chrome  • web-javascript • Google Chrome 120.0.6099.71
  Edge (web)        • edge    • web-javascript • Microsoft Edge 120.0.2210.61

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

If you expected another device to be detected, please run "flutter doctor" to diagnose potential issues. You may also try increasing the time to wait for connected devices with the "--device-timeout" flag. Visit https://flutter.dev/setup/ for troubleshooting tips.
```

コマンドの結果の中にUSB接続中のAndroid端末が見つかりません。。
開発者モードがONになっていること、USBデバッグがONになっていることは確認済みで原因がわからないので `fvm flutter doctor` を実行

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter doctor 
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.3, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[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
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2022 17.4.0)
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (3 available)
[√] Network resources

! Doctor found issues in 3 categories.
```

Android Studioをインストールしてないのはその通りなのでわかりますが、他の内容について少し気になる状態となっていました（主に`Android toolchain`の部分）。

どれが実機デバッグできない原因かがよくわからず、ひとまず2年前くらいにセットアップしたPCの情報と比較してみました。
```winbatch:cmd(2年くらい前にセットアップしたPCのVSCodeのターミナルで実行)
> fvm flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.3, on Microsoft Windows [Version 10.0.19045.3803], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
[√] Chrome - develop for the web
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2017 15.9.29)
    X Visual Studio 2019 or later is required.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2020.3)
[√] VS Code (version 1.85.1)
[√] Connected device (3 available)
[√] Network resources

! Doctor found issues in 1 category.
```

やはり`Android toolchain`でエラーが出ていることがダメっぽいことがわかりました。。
こちらAndroid Studioをインストールしたときに初回起動時のGUIからAndroidSDKをインストールした記憶があります。。

そこで、Android Studioの公式ページの説明を読んだところAndroid StudioをインストールせずにコマンドラインツールからAndroidSDKのインストールが行えそうな記述を見つけました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/f7f35aed-42d9-216d-7e59-838b0b9e9c22.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/40604571-0198-bf43-9730-5f769cfd15db.png)

### 8. Android toolchain(AndroidSDK)の設定
こちらの件は以下の2ページを読んでから作業を行いました。
 - [Android Studio とアプリツールをダウンロードする - Android デベロッパー &nbsp;|&nbsp; Android Developers](https://developer.android.com/studio?hl=ja)
 - [sdkmanager &nbsp;|&nbsp; Android デベロッパー &nbsp;|&nbsp; Android Developers](https://developer.android.com/studio/command-line/sdkmanager?hl=ja)

---
以下のページよりWindows用の「SDK ツール パッケージ」をダウンロード
[https://developer.android.com/studio?hl=ja](https://developer.android.com/studio?hl=ja)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/be5f657e-c4dd-9b33-6a2b-062213108bfb.png)

Cドライブ直下に`android_sdk`というフォルダを作成し、そこに展開

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/9f729aad-e05c-7729-cb42-98bdd851d81e.png)

`cmdline-tools`ディレクトリに`latest`というサブディレクトリを作成

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/868a7f2d-57ac-b3e9-0185-f2cfe0635204.png)

`latest`ディレクトリの中に元々存在したファイル一式を移動

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/2a128483-099b-bd13-9156-c0a128b05fc8.png)

`bin`ディレクトリの中にある`sdkmanager.bat`を実行したところ以下のエラーが出ました。
```winbatch:cmd
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager.bat
Exception in thread "main" java.lang.UnsupportedClassVersionError: com/android/sdklib/tool/sdkmanager/SdkManagerCli has been compiled by a more recent version of the Java Runtime (class file version 61.0), this version of the Java Runtime only recognizes class file versions up to 52.0
        at java.lang.ClassLoader.defineClass1(Native Method)
        at java.lang.ClassLoader.defineClass(Unknown Source)
        at java.security.SecureClassLoader.defineClass(Unknown Source)
        at java.net.URLClassLoader.defineClass(Unknown Source)
        at java.net.URLClassLoader.access$100(Unknown Source)
        at java.net.URLClassLoader$1.run(Unknown Source)
        at java.net.URLClassLoader$1.run(Unknown Source)
        at java.security.AccessController.doPrivileged(Native Method)
        at java.net.URLClassLoader.findClass(Unknown Source)
        at java.lang.ClassLoader.loadClass(Unknown Source)
        at sun.misc.Launcher$AppClassLoader.loadClass(Unknown Source)
        at java.lang.ClassLoader.loadClass(Unknown Source)
        at sun.launcher.LauncherHelper.checkAndLoadMain(Unknown Source)

C:\android_sdk\cmdline-tools\latest\bin> which java
C:\Program Files (x86)\Common Files\Oracle\Java\javapath\java.EXE

C:\android_sdk\cmdline-tools\latest\bin> java -version
java version "1.8.0_361"
Java(TM) SE Runtime Environment (build 1.8.0_361-b09)
Java HotSpot(TM) Client VM (build 25.361-b09, mixed mode)
```

Javaのクラスファイルのバージョンが古いとのこと。
何の用途で入れたJavaだったか思い出せませんが、最新のJava(JDK21)を以下のページよりダウンロード＆インストールしました。

[Java Downloads | Oracle 日本](https://www.oracle.com/jp/java/technologies/downloads/#jdk21-windows)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/def2035a-600d-d430-fcf7-bd33d245b446.png)

JDK21をインストール後、javaコマンドがインストールしたものを指していることを確認
```winbatch:cmd
C:\> which java
C:\Program Files\Common Files\Oracle\Java\javapath\java.EXE

C:\> java -version
java version "21.0.1" 2023-10-17 LTS
Java(TM) SE Runtime Environment (build 21.0.1+12-LTS-29)
Java HotSpot(TM) 64-Bit Server VM (build 21.0.1+12-LTS-29, mixed mode, sharing)
```

再度、sdkmanager.batを実行したところ、Javaに関するエラーは消えました。
sdkmanagerについて`11.0`というバージョンが確認できました。
```winbatch:cmd
C:\ > cd C:\android_sdk\cmdline-tools\latest\bin
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager.bat --version
11.0
```

ついでにsdkmanagerについて`bin`ディレクトリのパスをPath環境変数に追加しました。
`※これで任意のディレクトリからsdkmanagerのコマンドが実行できるはずですが、念のため以降の作業もbinディレクトリにいる状態で進めています。。`

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/a203b7b5-8dd0-594a-37c2-058330deb4ce.png)

`sdkmanager --list`でインストール可能なパッケージの一覧を確認（大量に出る）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/8335e11e-e5f1-2fc7-eed9-c36e1b863a31.png)

インストール可能なパッケージのうち必要そうなものを適当にインストール
`※こちら不足あるのでご注意ください（後続の手順の中でエラーを確認＆追加インストールしています）`
```winbatch:cmd
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --install "platforms;android-33"
Accept? (y/N): y
[=======================================] 100% Unzipping... android-13/framework

C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --install "build-tools;33.0.2"
[=======================================] 100% Unzipping... android-13/renderscr

C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --install "cmake;3.22.1"
[=======================================] 100% Unzipping... share/vim/vimfiles/s

C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --install "ndk;26.1.10909125"
[=======================================] 100% Unzipping... android-ndk-r26b/sha

C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --list_installed
[=======================================] 100% Fetch remote repository...
Installed packages:
  Path                 | Version       | Description                      | Location
  -------              | -------       | -------                          | -------
  build-tools;33.0.2   | 33.0.2        | Android SDK Build-Tools 33.0.2   | build-tools\33.0.2
  cmake;3.22.1         | 3.22.1        | CMake 3.22.1                     | cmake\3.22.1
  ndk;26.1.10909125    | 26.1.10909125 | NDK (Side by side) 26.1.10909125 | ndk\26.1.10909125
  platforms;android-33 | 3             | Android SDK Platform 33          | platforms\android-33
```

sdkmanagerによってインストールした各パッケージの実体は`android_sdk`ディレクトリ内に存在しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/72666131-2d54-2a8a-0f3e-55c787b50447.png)

sdkmanagerでインストールしたパッケージについて「ライセンスを承認する」という作業を実施します
```winbatch:cmd
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --licenses
[=======================================] 100% Computing updates...
6 of 7 SDK package licenses not accepted.
Review licenses that have not been accepted (y/N)? y

1/6: License android-googletv-license:
---------------------------------------

~~~省略~~~

Accept? (y/N): y
All SDK package licenses accepted
```

`fvm flutter doctor`を実行したときにエラーと合わせて表示されていたAndroidSDKの場所を設定するコマンド操作`flutter config --android-sdk`を実施
```
C:\workspace_flutter\flutter3_example> fvm flutter config --android-sdk C:\android_sdk 
Setting "android-sdk" value to "C:\android_sdk".

You may need to restart any open editors for them to read new settings.
```

ここまでの手順でAndroidSDKについてセットアップしたと考え、Flutterのプロジェクト側で`fvm flutter doctor`を再実行してみました。
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter doctor                              
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.3, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[!] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
    X Android SDK file not found: adb.
[√] Chrome - develop for the web
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2022 17.4.0)
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (3 available)
[√] Network resources

! Doctor found issues in 3 categories.
```

- `Android　toolchain`の項目について少しメッセージが短くなった！
- build-toolsとしてインストールしたバージョンが`Android SDK version 33.0.2`という形で表示されています
- 依然としてエラー状態なのはAndroidSDKの中に`adb`ってファイルが含まれていないとのこと

エラーメッセージでググったところstackoverflowのサイトで同じエラーについて質問している方を発見
[when I start to run flutter doctor it say X Android SDK file not found: adb. how I solve this problem - Stack Overflow](https://stackoverflow.com/questions/71296477/when-i-start-to-run-flutter-doctor-it-say-x-android-sdk-file-not-found-adb-how)
`platform-tools`というパッケージが足りていないとのことのようです。`sdkmanager --list`でパッケージ名を確認したうえでインストール

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/6272d01e-44b7-c257-6fee-a28496748480.png)

インストール後に「ライセンスを承認」の作業も一応行いましたが特に不要だったかも？
```winbatch:cmd
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --install "platform-tools"
[=======================================] 100% Unzipping... platform-tools/sqlit

C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --licenses
[=======================================] 100% Computing updates...
All SDK package licenses accepted.
```

この状態で再度`fvm flutter doctor`を実行
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
Could not parse java version from: 

If there is a version please look for an existing bug https://github.com/flutter/flutter/issues/ and if one does not exist file a new issue.
[√] Flutter (Channel stable, 3.16.3, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[!] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
    X Could not determine java version
    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
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2022 17.4.0)
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (4 available)
[√] Network resources

! Doctor found issues in 3 categories.
```

- エラー増えた？？:innocent:
    - →これはFlutterのプロジェクトを開いたVSCodeのターミナルで古い`java 1.8.0_361`を見続けてしまっていたことが原因でした。。。
- このタイミングでUSB接続中の実機デバイスを認識できてそうなログを確認できました（`[√] Connected device (4 available)`の行、元々3つだったのが4つになっています）

VSCodeを再起動後、再度`fvm flutter doctor`を実行
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.3, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
[√] Chrome - develop for the web
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2022 17.4.0)
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (4 available)
[√] Network resources

! Doctor found issues in 2 categories.
```

- Android Studioの指摘はインストールしないことを選択しているので無視でOK
- Visual Studioに関する指摘は少し気になりますが、別PCに構築した環境の方でも似たようなものが出ていたのでいったん問題ないということに:innocent:

#### この章のまとめ
sdkmanagerをインストールした後のAndroidSDKの各種パッケージをインストールするコマンド操作について、おそらくですが以下のような作業で良かったのかなと思います（`↑で実施したコマンドを抜粋しています`）。
```winbatch:cmd
> sdkmanager --install "platforms;android-33"
> sdkmanager --install "build-tools;33.0.2"
> sdkmanager --install "cmake;3.22.1"
> sdkmanager --install "ndk;26.1.10909125"
> sdkmanager --install "platform-tools"
> sdkmanager --licenses
```
```winbatch:cmd(VSCodeのターミナルで実行)
> fvm flutter config --android-sdk C:\android_sdk 
```

念のためこの時点でのインストール済みのパッケージの一覧について出力しておきます。
```winbatch:cmd
C:\android_sdk\cmdline-tools\latest\bin> sdkmanager --list_installed
[=======================================] 100% Fetch remote repository...
Installed packages:
  Path                 | Version       | Description                      | Location
  -------              | -------       | -------                          | -------
  build-tools;33.0.2   | 33.0.2        | Android SDK Build-Tools 33.0.2   | build-tools\33.0.2
  cmake;3.22.1         | 3.22.1        | CMake 3.22.1                     | cmake\3.22.1
  ndk;26.1.10909125    | 26.1.10909125 | NDK (Side by side) 26.1.10909125 | ndk\26.1.10909125
  platform-tools       | 34.0.5        | Android SDK Platform-Tools       | platform-tools
  platforms;android-33 | 3             | Android SDK Platform 33          | platforms\android-33
```

### 9. 改めて実機デバッグ
先ほどは表示されていなかったUSBデバッグをONにしている実機(`J9260の行`)が表示されました。
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter devices
Found 4 connected devices:
  J9260 (mobile)    • QV72084R4B • android-arm64  • Android 11 (API 30)
  Windows (desktop) • windows    • windows-x64    • Microsoft Windows [Version 10.0.22621.2861]
  Chrome (web)      • chrome     • web-javascript • Google Chrome 120.0.6099.71
  Edge (web)        • edge       • web-javascript • Microsoft Edge 120.0.2210.77

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

If you expected another device to be detected, please run "flutter doctor" to diagnose potential issues. You may also try increasing the time to wait for connected devices with the "--device-timeout" flag. Visit https://flutter.dev/setup/ for troubleshooting tips.
```

`fvm flutter run ~~`で実機を対象にしたデバッグビルドを実施したところプロセスの途中でエラーを吐いてしまいました。
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3_example> fvm flutter run -d J9260
Downloading android-arm-profile/windows-x64 tools...               490ms
Downloading android-arm-release/windows-x64 tools...               257ms
Downloading android-arm64-profile/windows-x64 tools...             240ms
Downloading android-arm64-release/windows-x64 tools...             225ms
Downloading android-x64-profile/windows-x64 tools...               217ms
Downloading android-x64-release/windows-x64 tools...               201ms
Launching lib\main.dart on J9260 in debug mode...
Running Gradle task 'assembleDebug'...

FAILURE: Build failed with an exception.

* What went wrong:
Could not open cp_settings generic class cache for settings file 'C:\workspace_flutter\flutter3_example\android\settings.gradle' (C:\Users\[私のユーザー名]\.gradle\caches\7.5\scripts\bw0sxfuavyc02rq2h05i38gwq).
> BUG! exception in phase 'semantic analysis' in source unit '_BuildScript_' Unsupported class file major version 65

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 24s
Running Gradle task 'assembleDebug'...                             26.3s

┌─ Flutter Fix ────────────────────────────────────────────────────────────────────────────────────┐
│ [!] Your project's Gradle version is incompatible with the Java version that Flutter is using    │
│ for Gradle.                                                                                      │
│                                                                                                  │
│ To fix this issue, consult the migration guide at docs.flutter.dev/go/android-java-gradle-error. │
└──────────────────────────────────────────────────────────────────────────────────────────────────┘
Exception: Gradle task assembleDebug failed with exit code 1
```

このログだけだとよくわからないので`--verbose`オプションをつけ再実行したところメッセージの中に以下の記載を見つけました。
```winbatch:cmd(VSCodeのターミナルで実行)
[        ] Caused by: java.lang.IllegalArgumentException: Unsupported class file major version 65
[        ]      at groovyjarjarasm.asm.ClassReader.<init>(ClassReader.java:199)
[        ]      at groovyjarjarasm.asm.ClassReader.<init>(ClassReader.java:180)
```

`major version 65`はJava21のことでJava21で何かを実行しようとしてエラーとなっているという解釈で良いのかなと思います。

その後、エラーでググったところGradleのタスクでエラーが起きていることがわかりました。
以下の画像はGradleとJavaのバージョンのサポートの対応表でJava21に対応したGradleは8.5のようです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/b61041ef-8d38-ece0-6e3d-f20e6f84f151.png)

Flutterのプロジェクト内に含まれるGradle関連の情報は探したところ以下にありました。
```properties:flutter3_example/android/gradle/wrapper/gradle-wrapper.properties
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-all.zip
```

`distributionUrl`という設定の中にgradle-`7.5`-all.zipという記述を発見しました。
↑に添付したGradleとJavaのバージョンの対応表と照らし合わせると作成したFlutterプロジェクトは元々Java18に対応していたということになるのかなと思います。
とりあえず`distributionUrl`の設定について7.5を8.5に変えてみました。

```diff:flutter3_example/android/gradle/wrapper/gradle-wrapper.properties
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.5-all.zip
```

再度`fvm flutter run ~~`コマンドを実行したところ先ほど表示された`major version 65`に関するエラーは起こらずに進みました。
また、`distributionUrl`について変更した内容を元に何かダウンロード＆展開してそうなログが流れていることも確認できました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/afaf4811-ad27-cbf5-8599-d1cb7d529d4c.png)


`--verbose`をつけたためログがたくさん出てますが数分待ったらデバッグビルドの最後に出るホットリロード、ホットリスタート等のキーに関する表示などが出力されていることが確認できました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/8ef664ee-6a40-342c-5113-fcf9c3163375.png)

実機の方を確認したところFlutterのHello World的なカウントアップを行うUIが表示されていました！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/ffa937c5-e685-5696-7d1a-b63c6250379d.png)

これで、実機を使用したデバッグビルドを通すところまでは何とか無事に行うことができるようになりました。
リリース用のビルドが行えるか、pub.devで公開されているパッケージが問題なくインストールできるのかなど確認すべき点はまだあると思いますがひとまずこの記事ではここまでとしようと思います。

#### ちなみに
正常に実機デバッグが行えた後に`sdkmanager --list_installed`を実行したところ以下のようになっていました。
```winbatch:cmd
C:\workspace_flutter\flutter3_example> sdkmanager --list_installed
[=======================================] 100% Fetch remote repository...       
Installed packages:
  Path                 | Version       | Description                      | Location
  -------              | -------       | -------                          | -------
  build-tools;30.0.3   | 30.0.3        | Android SDK Build-Tools 30.0.3   | build-tools\30.0.3
  build-tools;33.0.2   | 33.0.2        | Android SDK Build-Tools 33.0.2   | build-tools\33.0.2
  cmake;3.22.1         | 3.22.1        | CMake 3.22.1                     | cmake\3.22.1
  emulator             | 33.1.23       | Android Emulator                 | emulator
  ndk;26.1.10909125    | 26.1.10909125 | NDK (Side by side) 26.1.10909125 | ndk\26.1.10909125
  platform-tools       | 34.0.5        | Android SDK Platform-Tools       | platform-tools
  platforms;android-33 | 3             | Android SDK Platform 33          | platforms\android-33
```

- インストールした覚えのない`build-tools;30.0.3`と`emulator`が生えていました。
    - バージョン番号的に実機デバッグで使用するAndroid端末のAPIレベルに合わせたものっぽく見える
- `--verbose`つけて実行したときにもしかしたらこの辺の足りてないパッケージをインストールするログが流れていたかもしれない

その他、Cドライブ直下に作成した`android_sdk`ディレクトリについて現時点のサイズについて`3.51GB`の容量を使っていることを確認しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/bc7607fe-141f-306c-801a-19516a7e592b.png)

### 10. まとめ
まず、今回の手順の中で作成したFlutterプロジェクトについてGitHubにパブリックな状態で残しておきます。
[https://github.com/imo-tikuwa/flutter3-example](https://github.com/imo-tikuwa/flutter3-example)

今回構築したFlutterプロジェクトを含む各種バージョンに関する情報は以下の通り

|項目|バージョン|
|---|---|
|Chocolatey|2.2.2|
|fvm|2.4.1|
|Flutter|3.16.3|
|Dart|3.2.3|
|Java|1.8.0_361 → 21.0.1|
|sdkmanager|11.0|
|AndroidSDK(build-tools)|30.0.3、33.0.2|
|AndroidSDK(cmake)|3.22.1|
|AndroidSDK(emulator)|33.1.23|
|AndroidSDK(ndk)|26.1.10909125|
|AndroidSDK(platform-tools)|34.0.5|
|AndroidSDK(platforms;android-33)|3|

## 参考サイト
- [Chocolatey Software | Chocolatey - The package manager for Windows](https://chocolatey.org/)
    - Chocolateyの公式ページ
- [fvm | Flutter Version Management](https://fvm.app/)
    - fvmの公式ページ
- [leoafarias/fvm: Flutter Version Management: A simple CLI to manage Flutter SDK versions.](https://github.com/leoafarias/fvm)
    - fvmの公式リポジトリです。
    - 「PowerShell使えなくてChocolateyがインストールできない」「PATHは自分で設定するしアップデートも必要に応じて自分で手作業でやる:triumph:」って方はこちらのリポジトリのリリース一覧からWindows-x64用のzipをダウンロード＆展開することでも同じような環境構築が可能だと思います（試してない）。
        - 今見たらバージョン3系が存在しました:grinning:
- [Java Downloads | Oracle 日本](https://www.oracle.com/jp/java/technologies/downloads/#jdk21-windows)
    - JDK21をダウンロードしたときのページ
- [Windows install | Flutter](https://docs.flutter.dev/get-started/install/windows#android-setup)
    - `fvm flutter doctor`コマンドを実行したときにAndroidSDKが見つからないというエラーと合わせて表示されたリンク
    - AndroidSDKのライセンスについて承認するといった操作が必要なことが書かれていました
- [when I start to run flutter doctor it say X Android SDK file not found: adb. how I solve this problem - Stack Overflow](https://stackoverflow.com/questions/71296477/when-i-start-to-run-flutter-doctor-it-say-x-android-sdk-file-not-found-adb-how)
    - `flutter doctor`実行時にadbが足りてないというエラーについてググったときに読んだページ。
    - platform-toolsというパッケージが足りていませんでした。
- [Compatibility Matrix](https://docs.gradle.org/current/userguide/compatibility.html)
    - JavaとGradleに関するバージョンの対応について調べたときに見たページ

## 2023/12/20追記

- 元の環境でJDK8＋GradleのdistributionUrlが7.5の状態でFlutter3のプロジェクトを動かせていたことがわかりました。。
- fvmについてChocolateyを使わずスタンドアローン版のインストールを行いました
    - バージョンは`2.4.1`ではなく最新の3系(`3.0.0-beta.5`)に移行しました
    - 2023/12/20 現在の最新はこちら → [Release fvm 3.0.0-beta.5 · leoafarias/fvm](https://github.com/leoafarias/fvm/releases/tag/3.0.0-beta.5)
- その他、WindowsPCの開発者モードという設定をONにしました
- また、OracleよりJDK8(`Java SE Development Kit 8u202`)をダウンロード、インストールしました

### Chocolateyアンインストール
あまり良い考えではないと思いますがfvmについて一度インストールしたら頻繁なアップデートは不要だなと感じ、また、Chocolateyを使ったインストールしたってことも忘れそうということでアンインストールすることになりました。。

Chocolateyのアンインストールについて`C:\ProgramData\Chocolatey`ディレクトリを削除し、環境変数についてChocolateyのものと思われるものを適当に削除しました。
`※事前にChocolateyでインストールしたfvm等は削除したうえで作業しました`

公式のアンインストールに関するページ → [Chocolatey Software Docs | How to uninstall](https://docs.chocolatey.org/en-us/choco/uninstallation)

### fvm3インストール
WindowsPCなのでfvmのリリースページより`fvm-3.0.0-beta.5-windows-x64.zip`をダウンロードし、Cドライブ直下に展開

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/cba4ab79-7b55-c5a1-d57b-150edbcd1d84.png)

システム環境変数のPathにfvmを展開したパスを設定
今回は`C:\fvm-3.0.0-beta.5-windows-x64\fvm`というパスを設定しました

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/38163f5b-72d8-836d-ab60-68f52e5b36b2.png)

`fvm releases`や`fvm install`についてfvm3での見た目は以下のような感じになりました（かっこよくなった）。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/62980de3-fa07-43e8-16f6-4001b2b8618d.png)

### 開発者モードをON
この設定を行うことでコマンドプロンプトを使用したfvmの操作について、管理者ではないユーザーでエラーとなっていたものが正常に実行できるようになりました。
具体的には`fvm use 3.16.4`のようなプロジェクトで使用するFlutterSDKをセットアップする際の手順についてVSCodeの一般ユーザーなターミナルで操作が完結させられるようになりました。

Windows11では`システム > 開発者向け`の中で設定できました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/bf390f2a-cf2f-ec11-2bf9-f0fdabd81e42.png)

開発者モードをONにした状態でVSCodeのターミナル(cmd)から`fvm use 3.16.4`のセットアップが行えることを確認したときの様子。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/36d5d6c5-4dee-e92f-7257-4a072cf3fda1.png)

### Flutterプロジェクト側のfvm2→3への移行

この記事用に作成したリポジトリの中で以下のPRにまとめています。
[fvmについて2系から3系に移行 by imo-tikuwa · Pull Request #1 · imo-tikuwa/flutter3-example](https://github.com/imo-tikuwa/flutter3-example/pull/1/files)

なんとfvm3では`.gitignore`の除外設定とVSCode用のFlutterSDKのパスに関する設定（`dart.flutterSdkPath`）について`fvm use 〇〇`のコマンド操作の中で自動で行ってくれました:open_mouth:
既存プロジェクトとしてfvm2を使っている場合には以下のような手順で進めるとスムーズかと思います。

1. `.fvm`ディレクトリを削除
2. `.vscode/settings.json`から`dart.flutterSdkPath`の設定削除
3. `fvm use 〇〇`実行

fvm3ではプロジェクトがどのFlutterSDKを使用するかの情報はプロジェクトルートの`.fvmrc`というファイルで管理するようです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/b558aebe-8233-692f-6127-01238cf18ec0.png)

また、`.gitignore`の設定で`.fvm`フォルダ全体がGitの管理から外れるようになりました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/e671ba0b-6238-22f0-39b3-18bd9bbbe964.png)

`.vscode/settings.json`の`dart.flutterSdkPath`の設定は以下のような差異となりました。
```diff_json:.vscode/settings.json
{
-  "dart.flutterSdkPath": ".fvm/flutter_sdk",
+  "dart.flutterSdkPath": ".fvm\\versions\\3.16.4"
}
```

### Flutterプロジェクトで個別にJDK8を参照する
今回の記事用に作成したまっさらなFlutter3プロジェクトではなく、以前のPCで開発を進めていたプロジェクト（`Flutter2.8.1、Dart2.15.1を使用`）についてJDK21ではデバッグビルドが通せないという問題に直面しました。。

こちら以下のissueを参考にGradleが参照するjavaのバージョンを固定することで解決できました。
[explicitly set java binary path with flutter config · Issue #106416 · flutter/flutter](https://github.com/flutter/flutter/issues/106416)

```diff_properties:android/gradle.properties
org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
+org.gradle.java.home=C:\\Program Files\\Java\\jdk1.8.0_202\\
```

OracleよりダウンロードしたJDK8（`jdk-8u202-windows-x64.exe`）について特に設定を変更せずにインストールしたときのパスを設定しています。

ちなみに、Gradleの`distributionUrl`が記載された`gradle-wrapper.properties`は以下のような状態のままデバッグできました。

```properties:android/gradle/wrapper/gradle-wrapper.properties
#Fri Jun 23 08:50:38 CEST 2017
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip
```

ということで、記事の↑の方に書いた`distributionUrl`をJDK21に対応するURLに書き換えるという作業は誤りだったかもしれません。。:pensive:

最後に、Java関連の情報について以下の通りなことを記載いたします。。

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\[Flutter2.8.1を使ってるプロジェクト]> which java
C:\Program Files\Common Files\Oracle\Java\javapath\java.EXE

C:\workspace_flutter\[Flutter2.8.1を使ってるプロジェクト]> java -version
java version "21.0.1" 2023-10-17 LTS
Java(TM) SE Runtime Environment (build 21.0.1+12-LTS-29)
Java HotSpot(TM) 64-Bit Server VM (build 21.0.1+12-LTS-29, mixed mode, sharing)

C:\workspace_flutter\[Flutter2.8.1を使ってるプロジェクト]> "C:\Program Files\Java\jdk1.8.0_202\bin\java.exe" -version
java version "1.8.0_202"
Java(TM) SE Runtime Environment (build 1.8.0_202-b08)
Java HotSpot(TM) 64-Bit Server VM (build 25.202-b08, mixed mode)
```

## 2023/12/21追記

- [flutter3-example](https://github.com/imo-tikuwa/flutter3-example)とは別にもう少し踏み込んだ内容として[flutter_dotenv](https://pub.dev/packages/flutter_dotenv)、[supabase_flutter](https://pub.dev/packages/supabase_flutter)パッケージを使用した認証機能付きのアプリケーションを作っていたのですが、こちらがどうしてもJDK21でビルドできず問題の切り分けとして試しにJDK17をインストールしてデバッグしてみることにしました。
- ついでに`fvm flutter doctor`を実行した際の`Visual Studio - develop Windows apps`に関するアラートについても解消いたしました。

JDK21の状態が悪いのかは正直はっきりしていません。。
`gradle-wrapper.properties`について書き換えたりしてるのが良くないのかなと考えての作業となります。

ちなみにJDK21の状態で実機によるデバッグを行おうとすると以下のようなエラーが出てしまいます。。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/bd1f67fa-1802-356d-51bd-dd482e6e0d4e.png)

`gradle-wrapper.properties`は以下のような状態です。
```properties:android/gradle/wrapper/gradle-wrapper.properties
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-8.5-all.zip
```

### JDK17インストール
事前にJDK21は`アプリ > インストールされているアプリ`からアンインストールしたうえで作業を行っています。

まず、OracleのページよりJDK17のインストーラーをダウンロードしてインストール

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/81575cf9-2d36-29ad-9203-90dae79d4cfe.png)

`Program Files`以下にJDK17がインストールされていることを確認しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/dbe11117-58fc-9485-0c88-722bce7e845f.png)

コマンドプロンプトからJDK17のバージョンができることを確認しました。
```winbatch:cmd
> which java
C:\Program Files\Common Files\Oracle\Java\javapath\java.EXE

> java -version
java version "17.0.9" 2023-10-17 LTS
Java(TM) SE Runtime Environment (build 17.0.9+11-LTS-201)
Java HotSpot(TM) 64-Bit Server VM (build 17.0.9+11-LTS-201, mixed mode, sharing)
```

### flutter doctorのアラート解消

こちらはアラートの内容でググったときにヒットした以下のブログを参考にさせていただきました。
[Flutter 「Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the “Desktop development with C++” workload, and include these components:」の対処法 | mebee](https://mebee.info/2022/09/18/post-79330/)

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3-and-supabase-study> fvm flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.4, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
[√] Chrome - develop for the web
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2022 17.4.0)
    X Visual Studio is missing necessary components. Please re-run the Visual Studio installer for the "Desktop development with C++" workload, and include these components:
        MSVC v142 - VS 2019 C++ x64/x86 build tools
         - If there are multiple build tool versions available, install the latest
        C++ CMake tools for Windows
        Windows 10 SDK
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (4 available)
[√] Network resources

! Doctor found issues in 2 categories.
```

↑のブログで紹介されている内容のままですが、
- Visual Studio Installer 起動
- Visual Studio Community 2022インストール

を実施しました。

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3-and-supabase-study> fvm flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.16.4, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
[√] Chrome - develop for the web
[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.8.3)
[!] Android Studio (not installed)
[√] VS Code (version 1.85.1)
[√] Connected device (4 available)
[√] Network resources

! Doctor found issues in 1 category.
```

`Visual Studio - develop Windows apps`に関するアラートが消えました:pray:

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/92affe3d-f2c9-a2c7-aab1-78b26939cb20.png)


### JDK17の状態で実機デバッグ

`gradle-wrapper.properties`についてFlutter3プロジェクトを作成した初期の状態に修正
```diff_properties:android/gradle/wrapper/gradle-wrapper.properties
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.5-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-all.zip
```

`fvm flutter clean`でキャッシュを削除
```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3-and-supabase-study> fvm flutter clean

Deleting build...                                                  779ms
Deleting .dart_tool...                                               5ms
Deleting Generated.xcconfig...                                       0ms
Deleting flutter_export_environment.sh...                            1ms
Deleting ephemeral...                                                2ms
Deleting ephemeral...                                                1ms
Deleting ephemeral...                                                2ms
Deleting .flutter-plugins-dependencies...                            0ms
Deleting .flutter-plugins...                                         0ms
```

`flutter clean`コマンドではGradleのキャッシュ？は消えてないようなので`android/.gradle`ディレクトリを物理削除

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/c35fdb83-86a4-b464-6e90-9469deac5bb5.png)

- ↑に添付した画像はJDK17による実機デバッグが通った後に取得した画像になります。
- `distributionUrl=https\://services.gradle.org/distributions/gradle-8.5-all.zip`の記述をしていたころの名残で`8.5`というサブディレクトリが存在していたためまるごと削除しました。

あたらめて実機デバッグ

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3-and-supabase-study> fvm flutter run -d J9260

Resolving dependencies... 
  app_links 3.4.5 (3.5.0 available)
  flutter_lints 2.0.3 (3.0.1 available)
  functions_client 1.3.2 (2.0.0 available)
  gotrue 1.12.6 (2.1.0 available)
  lints 2.1.1 (3.0.0 available)
  matcher 0.12.16 (0.12.16+1 available)
  material_color_utilities 0.5.0 (0.8.0 available)
  meta 1.10.0 (1.11.0 available)
  path 1.8.3 (1.9.0 available)
  postgrest 1.5.2 (2.0.1 available)
  realtime_client 1.4.0 (2.0.0 available)
  storage_client 1.5.4 (2.0.0 available)
  supabase 1.11.11 (2.0.2 available)
  supabase_flutter 1.10.25 (2.0.2 available)
  test_api 0.6.1 (0.7.0 available)
  url_launcher_linux 3.1.0 (3.1.1 available)
  url_launcher_windows 3.1.0 (3.1.1 available)
  web 0.3.0 (0.4.0 available)
  web_socket_channel 2.4.0 (2.4.1 available)
  webview_flutter_android 3.12.1 (3.13.1 available)
  webview_flutter_platform_interface 2.8.0 (2.9.0 available)
  webview_flutter_wkwebview 3.9.4 (3.10.0 available)
  yet_another_json_isolate 1.1.1 (2.0.0 available)
Got dependencies!
23 packages have newer versions incompatible with dependency constraints.
Try `flutter pub outdated` for more information.
Launching lib\main.dart on J9260 in debug mode...
Running Gradle task 'assembleDebug'...                            220.8s
√  Built build\app\outputs\flutter-apk\app-debug.apk.
Installing build\app\outputs\flutter-apk\app-debug.apk...          12.2s
Error: ADB exited with exit code 1
Performing Streamed Install

adb: failed to install C:\workspace_flutter\flutter3-and-supabase-study\build\app\outputs\flutter-apk\app-debug.apk: Failure [INSTALL_FAILED_UPDATE_INCOMPATIBLE: Package
com.imo_tikuwa.flutter3_and_supabase_study signatures do not match previously installed version; ignoring!]
Uninstalling old version...
Installing build\app\outputs\flutter-apk\app-debug.apk...           9.9s
I/flutter (14410): ***** Supabase init completed Instance of 'Supabase'
Syncing files to device J9260...                                   170ms

Flutter run key commands.
r Hot reload.
R Hot restart.
h List all available interactive commands.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).

A Dart VM Service on J9260 is available at: http://127.0.0.1:52481/xv1eHLxDhMQ=/
The Flutter DevTools debugger and profiler on J9260 is available at: http://127.0.0.1:9101?uri=http://127.0.0.1:52481/xv1eHLxDhMQ=/
I/flutter (14410): ***** SupabaseDeepLinkingMixin startAuthObserver
```

一応画像も取得したので添付

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/4fd5716b-fd09-45cd-aa54-fe7c3031c5ca.png)

- `flutter clean`を行った後なのでpubspec.yamlに記載されたパッケージのインストールに関するログが最初に流れていました
- adb(`platform-tools`パッケージをインストールして解決したやつ？)について何か赤字でエラーが出ているようですが自動で解決してくれたようで、実機デバッグが通るようになりました！

以下のようなログイン画面が表示できました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2384986/e7b527bd-89d0-c1d2-335f-383187b2d072.png)

### その他

JDK17で実機によるデバッグが確認できたため、この記事の中の動作確認用のプロジェクト（[flutter3-example](https://github.com/imo-tikuwa/flutter3-example)）について`gradle-wrapper.properties`はFlutter3のプロジェクトを作成したときの初期の状態に修正済みとなります。

以下のコミットで修正済み。
[https://github.com/imo-tikuwa/flutter3-example/commit/bb95c965712e13f756d29490dd6cd114a3fe625f](https://github.com/imo-tikuwa/flutter3-example/commit/bb95c965712e13f756d29490dd6cd114a3fe625f)

---
`sdkmanager --list_installed`を実行したところ以前の状態とも異なる状態になっていたため、最新の状態を記載しておきます。

```winbatch:cmd(VSCodeのターミナルで実行)
C:\workspace_flutter\flutter3-and-supabase-study> sdkmanager --list_installed
[=======================================] 100% Fetch remote repository...       
Installed packages:
  Path                 | Version       | Description                      | Location
  -------              | -------       | -------                          | -------
  build-tools;30.0.2   | 30.0.2        | Android SDK Build-Tools 30.0.2   | build-tools\30.0.2  
  build-tools;30.0.3   | 30.0.3        | Android SDK Build-Tools 30.0.3   | build-tools\30.0.3
  build-tools;33.0.2   | 33.0.2        | Android SDK Build-Tools 33.0.2   | build-tools\33.0.2
  cmake;3.22.1         | 3.22.1        | CMake 3.22.1                     | cmake\3.22.1
  emulator             | 33.1.23       | Android Emulator                 | emulator
  ndk;26.1.10909125    | 26.1.10909125 | NDK (Side by side) 26.1.10909125 | ndk\26.1.10909125
  platform-tools       | 34.0.5        | Android SDK Platform-Tools       | platform-tools
  platforms;android-28 | 6             | Android SDK Platform 28          | platforms\android-28
  platforms;android-31 | 1             | Android SDK Platform 31          | platforms\android-31
  platforms;android-33 | 3             | Android SDK Platform 33          | platforms\android-33
```