Flutter学习笔记(1) - MacOS环境配置

iOS开发者的Flutter学习之旅，仅为个人学习用。

1.SDK下载

Flutter 是 Google 开源的 UI 工具包
官网下载比较慢，需要合理上网方式。
选择相对应系统下载解压即可

2.环境变量配置

如果使用默认的bash那么配置 ~/.bash_profile
如果使用zsh那么配置~/.zshrc
原文件配置尽量不要改动

#Flutter 镜像配置
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
#Flutter 配置
export FLUTTER=/Users/yangweikang/opt/flutter/bin
export PATH=$FLUTTER:$PATH

3.安卓配置

1.下载Android studio（flutter也可使用VSCode进行开发）
2.使用flutter doctor检测

• 出现错误如图所示
  

  image.png
  打开Android Studio -> Preferences -> Android SDK -> SDK Tools选择对应的SDK安装即可
  

  image.png
• 出现错误如图所示
  

  image.png
  如图安装对应SDK
  

  image.png
  
  安装后执行flutter doctor --android-licenses即可解决
  3.配置Android环境变量

#安卓
export ANDROID_HOME=~/Library/Android/sdk
#安卓模拟器路径
export PATH=${PATH}:${ANDROID_HOME}/emulator
#安卓tools路径
export PATH=${PATH}:${ANDROID_HOME}/tools
#安卓 平台工具
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

4.安装flutter插件

image.png

4.iOS配置

安装Xcode及cocopods即可。

5.简单使用

此时使用flutter doctor出现如下所示即成功配置

image.png

VC Code可以选择不安装
Connected device只需要启动Xcode或者Android studio其中一个模拟器即可以解决
1.创建工程

• Terminal创建
  运行命令flutter create demo即可创建第一个flutter项目（ps:项目名称使用小写否则会出现错误）
  
  

  image.png

• Android Studio创建
  

  image.png
  
  

  2.项目运行

• 打开项目目录，执行命令flutter run即可。此时需要打开至少一个模拟器即可运行，又或者使用flutter run -d '模拟器名称'即可
  使用R重新运行 r热重载代码

• Android Studio类似Xcode直接运行和选择模拟器
  

  image.png

如果Android Studio运行模拟器错误，是因为项目路径存在中文，放在全英文路径下，或者使用Terminal运行项目
3.模拟器加速
如果Android Studio模拟器运行速度慢，打开~/Library/Android/sdk/extras/intel/Hardware_Accelerated_Execution_Manager/目录下IntelHAXM安装加速。