如何使用主机的模拟器使 Flutter 在 WSL2 上工作?

How to make Flutter work on WSL2 using host's emulator?

提问人:Ουιλιαμ Αρκευα 提问时间:7/12/2020 最后编辑:Ουιλιαμ Αρκευα 更新时间:1/26/2021 访问量:14231

问:

这个问题令人头疼,所以我想分享我的解决方案。它开始安装 Android SDK(不安装 Android Studio)、Dart 和 Flutter 的要求,并最终在 Windows 主机上运行 Flutter 应用程序。

==================

在 WSL2 上

==================

$ lsb_release -a
Distributor ID: Ubuntu
Description:    Ubuntu 20.04 LTS
Release:        20.04
Codename:       focal

安装 Dart

$ sudo apt-get update && sudo apt-get upgrade
$ sudo apt-get install apt-transport-https
$ sudo sh -c 'wget -qO- https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -'
$ sudo sh -c 'wget -qO- https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list > /etc/apt/sources.list.d/dart_stable.list'
$ sudo apt-get update
$ sudo apt-get install dart
$ echo "export PATH=\"/usr/lib/dart/bin:$PATH\"" >> ~/.bashrc
$ source ~/.barshrc 
$ dart --version
Dart VM version: 2.8.4 (stable) (Unknown timestamp) on "linux_x64"

===>>> 注意:Dart SDK 与 Flutter 捆绑在一起

安装 Android SDK

获取仅适用于 Android (Linux) 的命令行工具

$ sudo apt install -y lib32z1 default-jdk git unzip zip
$ cd ~/Downloads
$ unzip commandlinetools-linux-6609375_latest.zip
$ rm commandlinetools-linux-6609375_latest.zip
$ mkdir -p Android/cmdline-tools
$ mv tools/ Android/cmdline-tools/
$ mv Android/ ~/Programs/

将以下行追加到文件:.bashrc

# Android
export ANDROID_SDK_ROOT=$HOME/Programs/Android
export PATH=$ANDROID_SDK_ROOT/cmdline-tools/tools:$PATH
export PATH=$ANDROID_SDK_ROOT/cmdline-tools/tools/bin:$PATH
export PATH=$ANDROID_SDK_ROOT/cmdline-tools/tools/lib:$PATH
export PATH=$ANDROID_SDK_ROOT/platform-tools:$PATH
export PATH=$ANDROID_SDK_ROOT/emulator:$PATH

# Java
export JAVA_HOME=/usr/lib/jvm/java-11-openjdk-amd64
export PATH=$JAVA_HOME/bin:$PATH

继续安装

$ cd ~
$ source .bashrc
$ sdkmanager --version
    4.0.1
$ sdkmanager --list
$ sdkmanager --install "system-images;android-29;google_apis;x86" "platform-tools" "platforms;android-29" "build-tools;29.0.3"
$ sdkmanager --install "cmdline-tools;latest"
$ sdkmanager --update
$ sdkmanager --list | sed -e '/^$/q'
$ sdkmanager --licenses

接受所有许可证。

安装 Flutter

$ cd ~/Downloads
$ wget https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_1.17.5-stable.tar.xz
$ cd ~/Programs
$ tar xf ~/Downloads/flutter_linux_1.17.5-stable.tar.xz
$ cd ~
$ echo "export PATH=$HOME/Programs/flutter/bin:$PATH" >> .bashrc
$ source .bashrc
$ flutter --version
Flutter 1.17.5 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 8af6b2f038 (11 days ago) • 2020-06-30 12:53:55 -0700
Engine • revision ee76268252
Tools • Dart 2.8.4
$ flutter config --android-sdk $ANDROID_SDK_ROOT

创建模拟器

$ cd ~
$ curl -s "https://get.sdkman.io" | bash
$ source .sdkman/bin/sdkman-init.sh
$ sdk v
    SDKMAN 5.8.3+506
$ sdk install gradle 6.5.1
$ gradle -v
$ avdmanager list
$ echo "no" | avdmanager --verbose create avd --force --name "generic_10" --package "system-images;android-29;google_apis;x86" --tag "google_apis" --abi "x86"

在文件中添加/修改以下行:~/.android/avd/generic_10.avd/config.ini

skin.name=1080x1920
hw.lcd.density=480
hw.keyboard=yes

检查模拟器是否已创建:

$ emulator -list-avds

==================

在 Windows 10 上

==================

> Get-ComputerInfo -Property "WindowsProductName"
Windows 10 Pro
> Get-ComputerInfo -Property "WindowsVersion"
2004
> Get-ComputerInfo -Property "OsBuildNumber"
19041
> Get-ComputerInfo -Property "OsArchitecture"
64-bit
> Get-NetIPAddress -AddressFamily IPv4 -InterfaceAlias Ethernet|findstr IPAddress
IPAddress         : 192.168.0.29

安装 Android SDK

获取仅适用于 Android (Windows) 的命令行工具

要遵循的步骤与在 WSL2 上安装 Android SDK 部分基本相同,如有疑问,可以阅读此页面以供参考。

创建模拟器

如需在 Windows 中安装 Gradle,请按照本页中的说明操作。 其余步骤与在 WSL2 上创建模拟器部分中的步骤相同,其中指出了 Windows 中的主文件夹。~

准备主机进行侦听

您可以将任何端口与 和 工具一起使用,但如果它们使用默认端口自行管理,则会更简单。对于工具,其默认端口为 5037。 服务使用该端口(就我而言),所以我不得不停止它adbemulatoradbIP Helper

打开终端,查看5037端口的状态:

> netstat -aon|findstr 5037

运行以下命令:

> adb kill-server
> adb -a -P 5037 nodaemon server

打开另一个终端(不要关闭前一个终端)并运行:

> emulator -avd generic_10

打开另一个终端(不要关闭以前的终端)并运行:

> adb devices
List of devices attached
emulator-5554   device

==================

在 WSL2 上

==================

使用主机的adb

$ echo "export ADB_SERVER_SOCKET=tcp:192.168.0.29:5037" >> ~/.bashrc
$ source ~/.bashrc
$ adb devices
List of devices attached
emulator-5554   device

运行我们的 Flutter 应用程序

$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.17.5, on Linux, locale C.UTF-8)

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
[!] Android Studio (not installed)
[✓] Connected device (1 available)

! Doctor found issues in 1 category.
$ flutter create hello_world
$ cd hello_world
$ flutter run   

==================

观察

==================

  • 首次生成/运行应用需要更长的时间
  • VSCode(远程)可以检测到此连接的设备,但它无法正确部署到模拟器,因此最好在终端上运行应用程序
  • 你不能在 flutter 应用中使用“热重载”功能,因为部署/运行过程永远不会完成,但是该包确实在模拟器中安装并运行,但对于源代码的任何更改,你需要重新运行应用程序。
  • 此操作消耗过多内存 (~90%)。有一个解决方法需要尊重。我的配置是:

.

[wsl2]    
memory=4GB # Limits VM memory in WSL 2 to 4 GB
swap=0

====================

咨询的页面

====================

flutter android-emulator adb android-sdk-manager

评论

1赞 Edoardo 10/14/2020
在 Linux 上设置 Flutter + VSCode 的非常可爱和不错的演练,...但是在 WSL 而不是 Windows 10 上运行 Flutter 有什么好处呢?
2赞 Ουιλιαμ Αρκευα 10/14/2020
我喜欢 Linux,因为它让我可以更轻松地在命令行上执行任务。您可以在 Windows 终端上执行相同的操作,但它不像 Linux 终端那样强大且易于使用。所以 WSL 看起来很有吸引力,我试图在那里工作 Flutter,结果并没有像预期的那样。目前我只在 Linux 发行版 (Manjaro) 上工作。
1赞 Edoardo 10/14/2020
无论操作系统的个人偏好如何,我觉得使用 WSL 在另一个模拟器运行一个 android 模拟器有点牵强。然后我在这里,因为我还在 Windows 上将 bash 设置为我的默认 shell,并从那里启动了 flutter:)
0赞 CoderBlue 3/24/2021
需要对此答案进行许多更改,但由于编辑 que 已满:
0赞 CoderBlue 3/24/2021
将 mkdir -p Android/cmdline-tools 更改为 mkdir -p ~/Programs/Android/cmdline-tools/tools

答:

1赞 Ryan Palmer 9/24/2020 #1

如果你像我一样,你在让 adb 工作时遇到很多问题。您需要确保 windows host 和 linux 镜像都具有相同的 adb 版本。遵循本指南 https://www.androidexplained.com/install-adb-fastboot/#update 帮助我在 Windows 上更新 adb。

4赞 ad_on_is 1/26/2021 #2

你不能在 flutter app 中使用“热重载”功能,因为部署/运行过程永远不会完成

实际上,你可以!只需连接到设备,而不是通过插座。在这里查看我的完整博客文章:adb connect <IP>

https://dnmc.in/2021/01/25/setting-up-flutter-natively-with-wsl2-vs-code-hot-reload/