站点图标 山维空间

在 macOS 上安装配置 Flutter SDK

前天 Flutter 官宣开始支持 Windows App,所以我想新的一年,也学一学 Flutter 开发,填补大前端的空白。这两天抽空把 Flutter SDK 装好了,过程还有点费劲,所以记一下。

我的系统是 macOS 12.1。

0. Flutter SDK

直接在官网下载压缩包:Install | Flutter

解压后放到一个不太深的文件夹里,我的是 ~/flutter

添加路径到 .zshrc

export PATH="`pwd`/flutter/bin:$PATH"

最后运行 flutter -v 能正常返回就算成功。

1. Android Studio

接下来运行 flutter doctor 检查环境,发现不少问题。先安装 Android Studio 解决 Android 开发问题吧。

下载并安装:Download Android Studio and SDK tools  |  Android Developers

我对 Android 生态不熟悉,用 Android Studio 的目的就是用 GUI 工具配置环境。所以在里面找到 SDK Manager,安装

1.1 安装 OpenSDK

Android 平台需要安装 JDK。按说 macOS 系统本身就集成在内,不过我希望用 OpenSDK 替换之。

# 安装 opensdk
brew install openjdk

# 链接库
sudo ln -sfn /opt/homebrew/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk

# 添加 PATH
export PATH="/opt/homebrew/opt/openjdk/bin:`pwd`/flutter/bin:`pwd`/Library/Android/sdk/tools/bin:$PATH"

# 验证
java -version

1.2 验证

最后运行 flutter doctor --android-licenses,接受所有 Android 协议,这篇儿也就通过了。

2. Xcode

直接使用 App Store 安装 Xcode。装好后启动,安装其余组件。然后执行下面命令,完成安装:

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

接下来还要装 CocoaPods,以便将来使用插件。我也不知道插件是干嘛的,不过让装就装吧。

brew install cocoapods

3. Chrome

Flutter 需要 Chrome 作为 web 开发平台,所以我们也要安装。不过它并不严格要求 Chrome,Edge 也可以。我现在主要用 Edge,配置一下就可以:

export CHROME_EXECUTABLE="/Applications/Microsoft Edge.app/Contents/MacOS/Microsoft Edge"

4. 配置开源镜像源

Flutter 也要使用类似 NPM 的包管理工具,这些工具都放在 Google 服务器上,所以难免受到牵连。所以要配置一下国内的镜像源,方便使用。

同样编辑 .zshrc

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

还有一些其它源可用,参考:在中国网络环境下使用 Flutter | Flutter 中文文档 | Flutter 中文开发者网站


遗留问题

参考链接


欢迎留言分享、讨论。

退出移动版