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

Question

This issue was a headache, so I wish to share my solution. It starts installing requirements for Android SDK (without installing Android Studio), Dart and Flutter, and it finalizes running a Flutter app on Windows host.

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

on WSL2

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

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

Installing 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"

===>>> Note: The Dart SDK is bundled with Flutter

Installing Android SDK

Get Command line tools for Android (Linux) only.

$ 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/

Append the following lines to .bashrc file:

# 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

Continue the installation

$ 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

Accept all licenses.

Installing 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

Creating the emulator

$ 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"

Add/Modify these lines in ~/.android/avd/generic_10.avd/config.ini file:

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

Check emulator created:

$ emulator -list-avds

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

on 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

Installing Android SDK

Get Command line tools for Android (Windows) only.

The steps to follow are basically the same as in the Installing Android SDK on WSL2 section, you can read this page for reference if any doubt.

Creating the emulator

To install Gradle in Windows, follow the instructions in this page. The rest of the steps are the same as in the Creating the emulator on WSL2 section, where ~ points out your home folder in Windows.

Preparing host for listening

You can use any port with adb and emulator tools, but it is more simple if they manage it by themselves using their default ports. For adb tool its default port is 5037. IP Helper service uses that port (in my case), so I had to stop it.

Open a terminal and check the status of port 5037:

> netstat -aon|findstr 5037

Run these commands:

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

Open another terminal (don't close the previous one) and run:

> emulator -avd generic_10

Open another terminal (don't close the previous ones) and run:

> adb devices
List of devices attached
emulator-5554   device

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

on WSL2

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

Working with host's adb

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

Running our Flutter app

$ 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   

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

Observations

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

• It takes a little longer to build/run the app for first time
• VSCode (remote) can detect this connected device, but it cannot deploy correctly to emulator, so it's better to run the app on terminal
• You cannot use "hot reload" features with flutter app because the process of deployment/running never finishes, however the package did be installed and running in your emulator, but for any changes in source code, you need re-run the app.
• This operation consumes too much memory (~90%). There's a workaround to respect. My configuration is:

.

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

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

Pages consulted

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

• https://flutter.dev/docs/get-started/install/linux
• Flutter with WSL 2
• Android Command line tools sdkmanager always shows: Warning: Could not create settings
• How to Install Flutter Without Android Studio on Ubuntu
• Install and Create Emulators using AVDMANAGER and SDKMANAGER
• Building a react native app in WSL2
• Using the Android emulator on Windows 10 with WSL2
• Developing Flutter with VSCode and WSL2
• Using ADB with WSL2
• ADB
• Android Debug Bridge (adb)
• How to use adb over TCPIP connect?
• Running React Native in WSL with the emulator running directly in Windows
• How can I deploy and execute an application on a device connected to a remote system?
• Kotlin could not find the required JDK tools in the Java installation
• Android Studio installs without sdkmanager

Solution 1

You cannot use "hot reload" features with flutter app because the process of deployment/running never finishes

Actually, you can! Just connect to the device with adb connect <IP> instead of going through the socket. See my full blog post here:

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

Solution 2

If you are like me you had a lot of issues getting adb to work. You need to make sure that windows host and the linux image both have the same version of adb. Following this guide https://www.androidexplained.com/install-adb-fastboot/#update helped me update adb on windows.