【Flutter入坑】Mac + VS Code + Android真机环境搭建

最近需要做移动端项目，在决定采用Flutter技术栈之后便开始了「从零学习Flutter开发」过程。没想到在第一步开发环境搭建过程中，就遇到了不少的坑。

Flutter官网给了开发环境的配置过程：flutter.cn/docs/get-st… ，不过我个人不喜欢官方的配置流程，手动下载SDK比较难维护、需要下载Xcode和Andriod Studio、没有使用VS Code开发等 要求都让人很不舒服。

所以最终采用了brew + VS Code + Android SDK + Android 真机 的方式搭建开发环境。

安装Flutter

我们这里使用brew来安装，这样不需要手动设置Flutter的环境变量，同时安装卸载流程都比较方便。

国内用户使用brew的时候还是推荐设置国内源，通过以下命令设置brew的清华源。

export HOMEBREW_CORE_GIT_REMOTE="https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/homebrew-core.git"
for tap in core cask{,-fonts,-drivers,-versions} command-not-found; do
    brew tap --custom-remote --force-auto-update "homebrew/${tap}" "https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/homebrew-${tap}.git"
done
brew update

源更改完成后可以通过以下命令自动安装Flutter SDK。

brew install --cask flutter

等待安装完成后执行flutter doctor命令，出现如下执行结果说明安装成功。

安装Android SDK

安装JDK8

安装Android SDK之前我们需要安装JDK8（是的，必须得JDK8，新版本的都不好使）。这里依然通过brew来安装。

brew install --cask temurin8

安装完后通过以下命令查看本机已安装的JDK版本。

/usr/libexec/java_home -V

在.profile文件中或者通过如下命令配置JDK版本为1.8。

export JAVA_HOME=$(/usr/libexec/java_home -v 1.8)

安装SDK

通过brew安装android-sdk如下。

brew install --cask android-sdk

安装完成后通过sdkmanager命令安装其他依赖包，如果执行sdkmanager命令报错说明JDK环境配置错误，不是使用的1.8版本。

sdkmanager "platform-tools"
sdkmanager "platform-tools" "platforms;android-28"
sdkmanager "platform-tools" "build-tools;28.0.3"
sdkmanager "cmdline-tools;latest"

使用brew list android-sdk命令查看SDK安装目录如下：

在.profile文件中或者通过如下命令设置SDK的环境变量。

export ANDROID_HOME=/opt/homebrew/Caskroom/android-sdk/4333796
export PATH=$PATH:"$ANDROID_HOME/platform-tools"
export PATH=$PATH:"$ANDROID_HOME/tools"

配置完成后，执行如下命令进行Android Licences签署。

flutter doctor --android-licenses

执行成功后再次执行flutter doctor命令可以看到Android toolchain一栏已经处于正常状态。

配置VS Code

插件安装

在VS Code插件市场搜索插件flutter并安装，在安装时也会自动安装dart语法插件。

新建项目

flutter插件安装完成后，使用快捷键command + shift + P调起命令查找，输入flutter，选择创建新的项目。

按照步骤创建完成项目后，会自动生成flutter的示例项目。我们可以通过/lib/main.dart中的入口函数来启动项目，在编辑器左侧可以查看当前项目的Widgets结构，在编辑器下发可以打开Dart devtools或者选择不同的预览设备。

预览Demo

真机运行

完成上述配置后，我们可以通过数据线将Android真机连接mac，连接成功后通过flutter devices命令或者VS Code底部状态栏都可以看到我们的设备。

此时我们可以通过在项目目录下执行flutter run命令来尝试启动我们的项目（这里不推荐直接通过VS Code启动，这样会看不到报错信息）。等待编译之后会发现项目启动失败，可以看到如下的错误信息。

比较明显的一个问题是说我们需要Java 11及以上的版本，可以通过修改环境变量来解决该问题（前面提到的JDK8只是用来安装Android SDK的，安装完成之后我们就可以升级版本，不会影响Android SDK的使用）。

export JAVA_HOME=$(/usr/libexec/java_home)

升级完成之后再次执行flutter run命令会发现flutter要求使用Android SDK 30以上的版本，命令行会自动进行安装升级，只需要耐心等待安装完成即可。

如果有🪜的话，安装完成便会自动在真机上安装APP并唤起，在命令行可以看到如下信息。

修改Android配置

对于墙内的同学，在上一步Android编译的时候可能会失败，主要原因是项目构建依赖的Android包无法下载，可以通过替换国内源的形式解决。

将项目目录下的/android/build.gradle文件以及flutter sdk目录下的/packages/flutter_tools/gradle/flutter.gradle文件中google()和mavenCentral()替换为如下地址。

maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter'}
maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }

替换后build.gradle文件内容为：

buildscript {
    ext.kotlin_version = '1.6.10'
    repositories {
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter'}
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
    }

    dependencies {
        classpath 'com.android.tools.build:gradle:7.1.2'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

allprojects {
    repositories {
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter'}
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
    }
}

rootProject.buildDir = '../build'
subprojects {
    project.buildDir = "${rootProject.buildDir}/${project.name}"
}
subprojects {
    project.evaluationDependsOn(':app')
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

总结

本文全程使用brew来进行安装，可以很方便的进行依赖管理，后续升级或者卸载也都容易实现。最最重要的则是不需要下载庞大的Xcode和Android Studio，在环境搭建过程中可以节省一大半的下载时间，而且还不需要占用内存哟~

推荐大家将brew的源替换为国内源，还是要比🪜快一些的。

最后祝大家入坑愉快~ 🎉🎉🎉