一、准备工作 Flutter开发 需要提前安装以下

1.升级macos系统为最新系统

2.安装最新的xcode

• appstore 搜索xcode选择下载

3.安装CocoaPods

• 可以查看我的文章 iOS 安装cocoapods

4.安装Android Studio

• 官网地址：https://developer.android.google.cn/studio
• 也可以去这里了解Android Studio相关信息 探索 Android Studio | Android Developers

5.安装 VSCode (如果不用VScode开发 可不安装)

• 官网地址：https://code.visualstudio.com/

6.安装 Chrome (开发web会用到,不需要可不安装)

二、下载flutter SDK

官网地址 https://docs.flutter.dev/development/tools/sdk/releases?tab=macos
建议选择正式稳定版本

image.png

//xxx代表电脑名称
/Users/XXX/development/flutter    

如果没有development文件可以自己直接创建或者通过命令行创建

mkdin ~/development

image.png

三、配置环境变量

打开终端 输入以下命令
如果你使用的bash那么配置 ~/.bash_profile

vim ~/.bash_profile

如果你使用zsh（Mac新系统默认是zsh）那么配置~/.zshrc

vim ~/.zshrc

如果这两个文件都没有，可以通过以下方法创建
一般在Mac上配置环境变量时经常要创建、编辑 .bash_profile文件。创建该文件时一般都会选择在当前用户目录下，即Mac下的.bash_profile 文件的路径是 /Users/YourMacUserName/.bash_profile (如果该文件已经创建过的话)
1 创建 .bash_profile
（1） 启动终端
（2） 进入当前用户的home目录(默认就是)：
cd ~ 或 cd /Users/YourMacUserName
创建zshrc

 touch .zshrc
 open -e .zshrc

创建bash_profile

    touch .bash_profile
    open -e .bash_profile

注意 一般根据系统创建其中一个就可以了 如果你使用的是zsh，终端启动时 ~/.bash_profile 将不会被加载，解决办法就是修改 ~/.zshrc ，在其中添加：source ~/.bash_profile

source ~/.bash_profile

image.png

在bash_profile添加镜像地址（如果你没有梯子的话） 和 配置flutter路径
镜像地址在官网 在中国网络环境下使用 Flutter - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

image.png

image.png

image.png

#请把XXX换成自己的电脑名称
#flutter环境变量
export PATH=/Users/XXX/development/flutter/bin:$PATH 
#flutter镜像地址
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
#android sdk目录
export ANDROID_HOME="/Users/XXX/Library/Android/sdk" 
#android tools目录
export PATH=${PATH}:${ANDROID_HOME}/emulator
#android tools目录
export PATH=${PATH}:${ANDROID_HOME}/tools
#android 平台工具目录
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

四 执行flutter doctor了

执行会发现futter安装好了，但是还是有问题，如下

image.png

解决xcode问题 xcode是因为CocoaPods 版本过低造成的，只需要升级CocoaPods就行
更新CocoaPods 安装：

gem install cocoapods

这将安装最新版本的 CocoaPods。如果您收到权限相关的错误，可以尝试在命令前加上 sudo：

sudo gem install cocoapods

完成再次执行就发现xcode可以正常使用了

image.png

另外如果xcode报错

Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS development.

则需要再终端执行

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

安卓报错

image.png

这个时候需要去Android Studio下载响应监听插件

image.png

按这个顺序选中6和7 点击apply下载
之后再次执行flutter doctor 发现提示变了 不在是无法监听了

image.png

这个时候按照提示执行

flutter doctor --android-licenses

中间会出现Accept? (y/N): 让选择 全部选择y同意就行

image.png

再次执行flutter doctor发现全部可以使用了

image.png

五 为Android Studio 安装flutter和dart插件

• 打开Android Studio

• 打开Plugins 如图

image.png

• 在Plugins搜索flutter

image.png

• 选择安装flutter

在安装flutter会提示是否安装Dart选择同意一起安装

image.png

自此flutter就配置完成了可以进行开发了