flutter mac电脑 ios开发环境配置

参考：https://flutterchina.club/setup-macos/
https://blog.csdn.net/lin1109221208/article/details/106343635
https://blog.csdn.net/jiangbw415/article/details/82993808
https://www.jianshu.com/p/c8507302ab09

一：下载配置flutter

1.去官网下载flutter sdk（对应mac 的就下载mac版本的flutter sdk），解压SDK包，并放入相应的路径（自建一个文件夹）
/Users/chengfangfang/FlutterSDK

2.我终端用的是bash,
有~/.bash_profile就打开
open ~/.bash_profile，
没有就创建
vim ~/.bash_profile。
（如果终端shell用的是zsh，就打开open ~/.zshrc，没有就创建 vim ~/.zshrc，在该文件中配置完成后，需要在终端输入命令，载入配置source ~/.zshrc）

在~/.bash_profile文件中，添加配置

Flutter 镜像配置:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
Flutter 环境配置:
export PATH=/Users/chengfangfang/FlutterSDK/flutter/bin:$PATH

vim ~/.zshrc,然后输入i编辑

截屏2021-07-11 上午11.06.56.png

注：/Users/chengfangfang/FlutterSDK是自定义的路径
注意： 此镜像为临时镜像，并不能保证一直可用，读者可以参考https://flutter.io/community/china 以获得有关镜像服务器的最新动态。

3.然后:wq保存退出，在终端输入以下命令，载入配置
source ~/.bash_profile

4.检查fluter是否配置好，在终端输入
flutter doctor

截屏2021-07-11 上午11.11.30.png

最终所有配置好的结果显示如下：√表示配置ok，×或！表示尚未配置好
注：flutter开发一般使用Android Studio，所以接下来安装及配置Android Studio

二、下载安装及配置Android Studio

参考：https://www.jianshu.com/p/2d1357203f09/
https://blog.csdn.net/qq_38436214/article/details/106658550

截屏2021-10-20 上午9.31.52.png

1.配置
Android Studio下载安装完成后，首次打开Android Studio需要配置
选Do not import settings

截屏2021-07-11 上午11.28.29.png

选择cancel

截屏2021-07-11 上午11.29.16.png

选next

截屏2021-07-11 上午11.31.52.png

选择standard (标准),Custom(自定义)都行，我这里选了Custom

截屏2021-07-11 上午11.32.00.png

选next

截屏2021-07-11 上午11.33.07.png

选next

截屏2021-07-11 上午11.34.37.png

选finish

截屏2021-07-11 上午11.40.19.png

选择Android SDk -> SDK Tools -> 去掉Hide ObSolete Package的√ ->勾选上Android SDK Tools（Obsolete），如下图所示,选apply

截屏2021-07-11 上午11.43.25.png

2.AS安装插件
AS偏好设置 -> Plugins ->输入flutter -> 找到相应插件点击 Install

3.安装好插件后，重启AS，可以看到start a new flutter project

Androidstudio新建flutter项目
创建flutter项目可以用终端，也可以用AS的start a new flutter project
双击Androidstudio 选择start a new flutter project

截屏2021-09-18 下午2.47.00.png

直接选next

截屏2021-07-11 上午11.53.45.png

点击finish

截屏2021-09-18 下午2.43.26.png

flutter项目命名可以用_连接符，不用驼峰式命名，（项目名称一定要小写）
，可以将项目存储路径修改为自定义的

三、编辑器除了用android studio，也可以用vs code

参考：https://www.jianshu.com/p/60dcb6e0c2ce

截屏2021-10-20 上午9.31.44.png

下载并安装vscode，在vs code下载安装flutter,Dart
分别下载Dart、dart-import、Dart (Syntax Highlighting Only)、Flutter
打开vscode --> Extensions -->搜索对应的插件并安装

截屏2021-07-12 下午1.08.09.png

vs code新建项目
1法：双击VScode,快捷键（command+shift+p）新建项目，打开vscode命令面板，选择Flutter:new project,然后输入项目名称选择项目保存路径。
2法：双击VScode,点击左下角设置，选择明亮（command platte） ,输入flutter:new，选择flutter:new application project,弹出选择路径界面（可以把项目放到新建的一个文件夹，必须小写），默认项目名称（可以修改）
3法.已打开一个VS code项目，想再新建个flutter项目，点击左上角菜单栏File-》New Window,再执行1或者2

截屏2021-07-12 下午1.08.18.png

截屏2021-07-12 下午1.08.36.png

选路径，点select a folder

截屏2021-07-12 下午1.08.57.png

可以修改项目名称

截屏2021-07-12 下午1.09.14.png

完成后就是如下界面

截屏2021-07-12 下午1.09.36.png

在项目文件夹里面有iOS文件夹，里面是iOS 项目工程，双击Runner.xcworkspace工程可以直接Xcode打开iOS项目，并且可以运行起来

截屏2021-07-12 下午1.15.48.png