环境：
MacPro电脑系统macOS Big Sur 11.6
Flutter SDK
Xcode
Andriod Studio

1 安装Flutter

安装步骤可以直接参考官网官网

1.1 下载Flutter SDK

1.1 进入官网

image.png

1.1.2 选择对应的系统

image.png

1.1.3 下载最新压缩包

image.png

1.1.4 解压SDK包

下载完成后，接下来就是安装路径。
因为Flutter的SDK中包含了很多命令行工具，所以建议安装到你平时放命令行工具程序的地方！这里放在了家目录下～/flutter（目录仅供参考）

1.2 配置环境变量

Flutter在运行的时候去要去服务器下载资源，而资源又在国外的服务器上，所以这个地方要么你“科学上网”，要么就是使用镜像服务器。
其实官网早就有提示

image.png

1.2.1 镜像配置

来到shell进行配置文件配置
本机使用的zsh，所以配置～/.zshrc文件。如果没有此文件，请执行

touch ~/.zshrc

如果你的mac默认的是bash，请配置~/.bash_profile文件

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

1.2.2 环境变量配置

同样是在～/.zshrc或者~/.bash_profile中配置

#flutter 环境变量
export FLUTTER=~/flutter
export PATH=$FLUTTER/bin:$PATH

⚠️FLUTTER=(你的flutter安装地址)
文件配置完成后，执行

source ~/.zshrc
#bash 执行 source ~/.bash_profile

执行结束后，检查flutter安装情况，执行

flutter doctor

会出现如下结果

image.png

对号表示没有问题，叉号表示没安装好

2 Xcode安装

直接前往Appstore安装，这里就不再啰嗦

3 配置Andriod Studio

3.1 下载ndriod Studio

国内官网传送门下载

image.png

3.2配置SDK

直接根据安装引导，整个过程无需“科学上网”
当然我们还可以直接在Andriod Studio 偏好设置页面

image.png

如果要下载的sdk显示不全，请去掉Hide Obsolete Packages中的对号

3.3配置flutter插件

image.png

当出现如下弹框时

image.png

选择Install 进行安装
安装完成 重启Andriod Studio后，出现如下页面

image.png

3.4 解决证书问题

3.4.1 执行 flutter doctor出现如下报错

image.png

可以执行

flutter doctor --android-licenses

当提示是否接受许可时，直接一顿y

3.4.2 如果如下报错

image.png

在偏好设置中，先下载最新的SDk

image.png

然后继续执行上面flutter doctor --android-licenses
最后执行flutter doctor，可以看到关于Android license的报错已经没有了。

3.5 更换夜神模拟器（自己选择，可以不换）

因为好用，支持Mac，所以就换（关键还能玩游戏）

image.png

安装完，直接启动模拟器，然后就能在as中使用了

image.png

3.5.1如果发现模拟器卡在99%不动了，请看看这里

image.png

3.5.2如果打开了夜神模拟器，发现as上搜索不到

第一步 检查Virtual Box的状态是否是正在运行

image.png

第二步 执行

#进入夜神软件目录
cd /Applications/NoxAppPlayer.app/Contents/MacOS
#连接夜神模拟器
adb connect 127.0.0.1:62001

然后就可以在as中选择夜神模拟器了

4 创建flutter工程

直接创建个flutter工程，开始搞起来

4.1 创建flutter工程

4.1.1 选择New Flutter Project

image.png

4.1.2 Flutter

image.png

4.1.3 工程名称

image.png

这里的工程名字不能用驼峰命名法，只能小写+下划线隔开
此时你开心的run，然后控制台输入出卡住了

4.2 Gradle卡住

然后发现，你首次运行的时候，卡在这一块，因为Gradle的Maven仓库在国外服务器，然后你懂的哈···

image.png

解决这个问题，换个国内镜像

4.2.1 修改flutter安装目录中的flutter.gradle文件

执行：

# ~/flutter 你的flutter安装路径
vi  ~/flutter/packages/flutter_tools/gradle/flutter.gradle

增加改镜像地址

buildscript {
    repositories {
//        google()
//      mavenCentral()
//更换镜像地址
maven { url 'https://maven.aliyun.com/repository/google' }
maven { url 'https://maven.aliyun.com/repository/jcenter' }
maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:4.1.0'
    }
}

4.2.2 修改工程目录中的build.gradle文件

文件目录项目-andriod-build.gradle

image.png

修改完之后，继续run

4.2.3 大功告成 结束

我这里用的夜神模拟器，你可以选择web、iOS模拟器等都可以

image.png

以上就是本人在创建mac环境下flutter工程遇到的问题和解决方法，如果有什么不对的地方，还敬请大神指点。