Setting up Flutter on an M1

I just got a new Mac Mini with M1 CPUs. The first thing I did was install Chrome. The next thing I did was install Flutter.

Installing Flutter

So I went to flutter.dev and downloaded the latest build. I extracted it, then created a new .zshrc and added flutter to my PATH. Then I ran flutter. It started downloading the Dart SDK, then threw this error:

% flutter
xcode-select: note: no developer tools were found at '/Applications/Xcode.app', requesting install. Choose an option in the dialog to download the command line developer tools.
Downloading Dart SDK from Flutter engine 92ae191c17a53144bf4d62f3863c110be08e3fd3...
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100  174M  100  174M    0     0  1506k      0  0:01:58  0:01:58 --:--:-- 2572k
Building flutter tool...
$home/flutter/bin/cache/dart-sdk/bin/pub: line 49: $home/flutter/bin/cache/dart-sdk/bin/dart: Bad CPU type in executable
$home/flutter/bin/cache/dart-sdk/bin/pub: line 49: $home/flutter/bin/cache/dart-sdk/bin/dart: Undefined error: 0
Error: Unable to 'pub upgrade' flutter tool. Retrying in five seconds... (9 tries left)

A quick search on Google led me to this post. I installed Rosetta, then made Terminal.app open with Rosetta. For now I'll do this at the cost of performance, so that I don't have to hunt down which ones are compatible and which ones are not compatible with M1 yet.

And now that it's running fine, I realize there was indeed a note on installing Flutter on Macs with M1 processors:

Android Studio, Android Emulator, Visual Studio code are not ready for a stable build for M1, but it's being worked on. Things should get better in a few months at most. Until then there's always Rosetta.

Installing the Emulator

Selecting an arm64 version of Android R did not work. So I had to use the emulator preview release.

Release Initial Preview · 741g/android-emulator-m1-preview
This is the first preview. This only works on M1 Apple Silicon Macs. It has a lot of rough edges. To use, open the .dmg, drag/drop to /Applications, then right click in /Applications and select Ope...

It works mostly fine, except for WebView, says the documentation. When I tried it, it worked indeed. Then I launched my app, and clicked on the button to sign in. I'm using Firebase Auth, and what it does is, it makes you sign in... in a WebView. The WebView never showed up, and so I am unable to test my app in the emulator.

Can I run the Intel version of the emulator with Rosetta? No because the emulator uses virtualization, says the Android Studio team.

Those who already have a new Mac with M1, what is your experience with Android Studio? from androiddev

So I am stuck using my slower MacBook until they release a proper emulator.

Installing the Emulator, 2nd try

Fast forward a few weeks, and it looks like new versions of the Emulator have been released. According to this post, it's even downloadable through the AVD Manager in Android Studio!

I followed the steps and downloaded the same image. However, the Emulator refused to run. The error was something like "The Emulator was killed". A quick search on Google reveals that quite a few users ran into the same issue a few days ago:

Emulator appearing offline on M1 Mac after the last update of arm64-v8a
Yesterday the emulator was working perfectly. The system image was arm64-v8a. I don’t exactly remember the Release name of the working system image but, yesterday there was an update for the ARM 64
Getting Device emulator-5554 is offline
Cannot run Android app on flutter. Getting Device emulator-5554 is offline. I’m thinking it could be and emulator issue since I’m on M1 but it worked 2 days ago and after a flutter upgrade everything

It looks like version 3 is broken, but version 2 isn't. The users show a way to manually replace that image with an old one, but I simply opted for downloading the separate Alpha Emulator from GitHub at https://github.com/google/android-emulator-m1-preview/releases/tag/0.3.

This version has WebViews, so I was able to run my Flutter app and sign in with Google. That will suffice for now!

Installing the Emulator, 3rd try

Fast forward to August 2022. There should be a way to use the AVD Manager in Android Studio instead of using a 2 year old experimental build. I open Android Studio, set up a new VM with an arm64 image of Android 33. I then run it, and... it crashes again. What?...

So I looked for how other people did it on Google. I found this post that said we should update the Android Emulator. How do I update it? See here: https://developer.android.com/studio/run/emulator#update. Gotta select the Android Emulator item in the SDK Tools.

Select the Android Emulator and click OK. It works with version 31.3.10.

After updating it, the VM boots up correctly!