MAC电脑配置Flutter环境
前言
Flutter目前已经是炙手可热的前端技术,关于他的好处和用处就不多说,接下来说下Mac电脑环境下怎么配置Flutter环境,做个记录也提供给大家
本次版本：
- Mac OS X 13.1
- FlutterSDK 3.7.0
- Xcode 14.1
- Android Studio Electric Eel | 2022.1.1
配置流程
安装Flutter - 下载Flutter的SDK - 配置flutter环境变量 - 安装VSCode(或者Android studio) - 安装flutter插件 - 安装java和配置环境变量 - 配置模拟器
说明:用vscode和android开发都可以各有各的利弊,看个人习惯,vscode比较清爽,Android studio 功能比较强大,建议都装上,想用哪个可以自由切换,也方便以后调试安卓代码
详细配置流程
安装Flutter
这里的步骤其实和官方的差不多，大家也可以直接参考 官网
image.png
image.png
image.png
下载完以后,接下来就是安装路径了
因为Flutter的SDK中包含了很多命令行工具。我们需要配置环境变量，所以建议你安装到你平时放命令行工具程序的地方! 我这里安装在了根目录的opt下!
/opt/flutter （仅供参考，安装在哪里看你自己的习惯）
配置环境变量
来到你对应Shell的配置文件进行配置。
如果你使用默认的bash那么配置 ~/.bash_profile
如果你使用zsh（Mac新系统默认是zsh）那么配置~/.zshrc
#Flutter环境镜像配置
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PATH=/opt/flutter/bin:$PATH
配置完成后，重新打开终端或者输入命令载入配置
#你自己的配置文件路径
$ source ~/.zshrc
那么接下来!我们可以看看Flutter是否配置完成了。Flutter有一个doctor检测指令。专门用于检测你的Flutter环境的。
flutter doctor
打钩就是配置OK了. 叉叉就是还没有配置好的.
我们最终要看到下图就...解决了差不多了。
image.png
至此 flutter配置完成 接下来是安装android studio
vscode直接去官网下载安装即可,安装完下载flutter插件,这里不再多说
配置安卓环境
安装Android Studio
我们先安装Android Studio可以去国内官网下载
image.png
配置SDK
首次启动会提醒你安装SDK。安装过程无需翻墙,但是有一个工具是需要我们手动安装的。
注意：这一步很多人会忽略，在后面 flutter doctor 会发现许可证问题。然后还会提示升级SDK，其原因就是这一步没有做对！
当我们装好了SDK后，打开Android Studio
- CMD + ， 进入偏好设置
- 如下图安装
image.png
安装Android Studio的插件
来到Studio的偏好设置里面.
image.png
当跳出安装Dart插件的界面时，也点击Yes进行安装。
- 安装完成后重启Android Studio。可以看到有这样的界面
image.png
解决许可证问题
再次进行Flutter的检测$ flutter doctor会发现许可证问题!
image.png
打开Iterm（终端）输入下列命令
然后一顿y
flutter doctor --android-licenses
配置安卓的模拟器
去设备管理里面下载一个模拟器,就可以运行项目了
配置java和Android环境
export JAVA_HOME="/Library/Java/JavaVirtualMachines/jdk-17.jdk/Contents/Home"
export ANDROID_HOME=/Users/lk/Library/Android/sdk
export CLASS_PATH="$JAVA_HOME/lib"
export PATH="$PATH:$JAVA_HOME/bin:$ANDROID_HOME/platform-tools"
感谢你查阅.
