本文首发简书，本人为原作者，转至掘金
转载请注明出处 https://www.jianshu.com/p/c55ad0e8f24f高能提示：文章字数不多，图很多，请做好战斗准备
前言
写这篇文章的原因是我自己的macbook开不开机，返修后，所有开发环境全部没有了，正好要重新配置开发环境，所以写一个从零配置的文章
因为flutter涉及到跨平台开发，所以预想中会包含四部分 mac篇，android篇，ios篇，flutter篇术语相关
cmd = command键（空格左边）
opt／alt = option键（cmd左边） ctrl = control（opt左边） cli = 命令行工具（command-line interface,命令行界面) as = Android Studio写在前面
最低需要xcode 9.0.0 以上的xcode版本
但是不建议从非官方渠道下载xcode，以免遇到之前盗版xcode的问题我就是都装好了8.3才告诉我这个，没办法只能升级系统，再升级xcode
mac篇
所谓mac篇就是一些基础的环境，和效率工具
后面会使用
cli
我这里使用，一个免费的开源的命令行工具
默认的命令行工具用launchpad=> 其他 => 终端打开zsh，用于替换bash环境，直接命令行中敲zsh,即可进入，修改默认zsh的可以自行百度
oh my zsh，一个zsh插件 具体可以自行百度一个很方便的包管理工具，基于ruby+git
命令行敲/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"即可 这里会自动安装xcode命令行环境，git环境，需要输入密码确认 效率篇
Alfred 一个快速开启app的辅助工具
Paw http工具 Sip 取色器dmg相关
遇到提示dmg损坏，不要着急 并不一定是真的损坏里，参考这里 https://bbs.feng.com/read-htm-tid-10584598.html ，允许所有的来源即可
对于mac新手来说，可能不会使用dmg，双击打开，有允许点允许，有dmg密码输入密码，最后将应用拖入到application／应用里，一般dmg里都有快捷方式，没有的话自己打开finder／访达，拖到应用程序里面也行
环境变量相关
不会配置环境变量的，这要仔细看了
在cli中敲对应的命令即可export NAME=VALUE //加入环境变量
unset NAME //删除环境变量source fileName //使重新读取配置文件
这个敲击仅当前cli或衍生cli有效，想要永久生效就要将配置加入配置文件中
默认是bash，所以我们编辑bash的配置文件
vi .bash_profile 我这里使用的是vim工具，如果不习惯 后续的vi可以换成open ，遇到文件不存在就先敲touch $fileName 默认是没有.bash_profile 文件的，创建 并添加
export PATH=XXXXX:$PATH 这里XXX代表了你自己的环境变量（adb，jdk，flutter）等 因为我使用的是zsh,这里配置zsh相关的，让zsh可以“读取”到bash的配置即可
vi .zshrc 复制代码
在最后一行添加
source .bash_profile 保存，退出 vi个人常用命令
i插入 a在后插入 shift+4 行尾 l+数字，enter 指定行号 dd 删除行 yy 复制行 p 粘贴行 :wq 保存退出 :q 保存退出 :q! 强制退出不保存ios篇
从app store安装xcode，建议不要使用迅雷等工具下载
我这里不是最新的mac os版本，所以需要下一个旧的xcode
等待漫长的安装，然后运行xcode
等待中
插一句，我这里因为先安装了brew，所以xcode命令行工具预先安装到了mac里，如果没装brew，这里可能会提示安装xcode命令行工具，git等等，请同意即可
点击cmd+，打开首选项
android环境篇
android studio安装
这里我使用一个中文镜像 http://www.android-studio.org/ 下载
有梯子的可以去 android官网下载拖到application里
打开
出现这个不要紧 cancel就行
一路next
finish
等待，这里大部分的资源目前应该不需要梯子，头几年都是要翻才能下的
finish
出现这个窗口就说明android的环境ok了
配置android的环境变量
jdk
新开一个命令行
javac -version java -version能正确显示版本号即可
添加javahome环境变量
如果你是pkg安装的，先看看java安装目录，自己解压的压缩包那就按照自己的目录
/usr/libexec/java_home -V 复制代码
配置在.bash_profile里
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_181.jdk/Contents/Home export PATH=$JAVA_HOME/bin:$PATH 复制代码
别忘了
source .bash_profile 复制代码
androidsdk
如果是通过刚刚的android studio自动安装的，则目录会在/Users/caijinglong/Library/Android/sdk下
目前我的.bash_profile是这样的
export ANDROID_HOME=/Users/caijinglong/Library/Android/sdk/ export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_181.jdk/Contents/Home export PATH=$JAVA_HOME/bin:$ANDROID_HOME/platform-tools:$PATH 复制代码
第三行的$JAVA_HOME/bin 有没有其实没关系
现在返回cli中，敲adb会出现很长的英文，这个是adb命令的说明 能出现则说明成功，不成功的话请重新检查下环境变量是不是没配置好 flutter篇
终于要开始flutter篇了
pub环境变量
这里建议没有常驻翻墙的同学打开下面的页面，配置下中文的pub镜像，pub是dart官方提供的一个中心仓库，可以将依赖／开源库上传到上面
https://github.com/flutter/flutter/wiki/Using-Flutter-in-China官网
有能力的同学这里自己进入按照mac篇进行配置
或者继续看下去开始安装flutter
cli：
cd ~/Library mkdir Flutter && cd Flutter 复制代码
这里可能会比较慢 可以使用gitee的镜像来clone
//github git clone -b dev https://github.com/flutter/flutter.git //gitee（我同步github的库） git clone -b dev https://gitee.com/kikt/flutter.git 复制代码
后续修改git的remote为github地址即可
git remote set-url origin https://github.com/flutter/flutter.git 复制代码
查看下
git remote -v 复制代码
配置flutter的环境变量
这里配置flutter_home
export FLUTTER_HOME=/Users/caijinglong/Library/Flutter/flutter export PATH=$JAVA_HOME/bin:$ANDROID_HOME/platform-tools:$FLUTTER_HOME/bin:$PATH 复制代码
接着返回cli
cd ~ source .bash_profile flutter doctor -v 复制代码
这个flutter doctor -v
就是显示flutter的环境问题，以后可能会经常敲这里加-v就是详情，如果有问题需要帮助，这里一定要带-v
这里加-v就是详情，如果有问题需要帮助，这里一定要带-v 这里加-v就是详情，如果有问题需要帮助，这里一定要带-v这里加-v就是详情，如果有问题需要帮助，这里一定要带-v
接着就是漫长的等待，这里会下载flutter的相关构建工具等等
这里带X的就是有问题的，我们需要一项项的去解决
大部分都给了cli方案 就是run： 后面的东西 这里我们看到了建议大家使用brew去安装这些库，这也是为什么我这里开篇就介绍如何安装brew的原因这里我标记了6个问题
- android 许可证问题
flutter doctor --android-licenses
- xcode的问题
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
- flutter ios工具链的问题
这里需要使用brew安装一些工具以帮助flutter可以调试ios程序，你模拟器能跑起来，但是ios真机不行大概率就是这里的原因
cli:brew install --HEAD libimobiledevice` 复制代码
这里会安装很多的二进制库
brew install ideviceinstaller 复制代码
brew install ios-deploy 复制代码
- 这里是ios开发相关的了
使用cocoapod作为ios的库管理工具，这个是ios开发中很常见的一个包管理工具，我们按照提示安装
brew install cocoapods 复制代码
接着是安装pod的库相关的索引
pod setup 复制代码
这里看到 下载速度还行，虽然没有国内快，但是也有接近4m的速度了，如果这里你的速度不佳，可以考虑使用gitee的spec中转，
平心而论，pod的索引方式个人感觉很蠢，最初数量级小的情况下还算能接受，现在pod的库数量越来越多，用这种方式来做中心库索引简直接受不了，后面会越来越臃肿
- android studio 插件问题
在studio中点cmd+, 打开首选项
点击plugin选下载人多的
然后耐心等待
完成后是这样的
点击重启后
问题解决完毕
我们返回到cli中 敲
flutter doctor -v 复制代码
我这里因为系统版本的原因下载不了9.0.0以上的xcode，只能升级版本后重新下载了，这个后面补上
先完成第二个，有两个选择 pip install six sudo easy_install six
sudo easy_install six 复制代码
然后我们只剩下xcode的问题了，如果你的xcode版本没问题，那你可以跳过这里，直接看flutter的运行相关
系统更新
到mac app store中 去下载新的系统版本
完成后打开，接着一路下一步，都是中文，等待完成就行
系统更新完成，现在开始更新xcode
完成后，回到cli中
flutter doctor -v 复制代码
提示我要同意协议
这里可以打开xcode，也可以直接命令行敲击，建议直接打开xcode我这里用命令行同意
sudo xcodebuild -license 复制代码
到这里xcode的问题就都解决了
再次flutter doctor -v
pod又出问题了，还是应该先升级系统，再一次性安装，这又来了无用功
按提示走把brew install cocoapods 复制代码
告诉我已经安装了 提示我reinstall
brew reinstall cocoapods 复制代码
flutter部分的环境配置到这里基本完成了，接着就该运行项目了
运行项目
初次建立项目建议使用cli创建，因为会很慢，用as的话 你很难知道自己在等什么，甚至网络链接失败你都不知道
cli里敲击
flutter create hello_world 复制代码
项目名不能有大写字母，所以建议使用下划线作为单词的分隔
android运行
右上角
我这里新装的sdk，没有android的镜像，所以download下
接着点选刚刚下载的，一路next+finish
运行后关闭device manager 回到主界面
这第一次运行会下载gradle，速度不好说，可能会很慢
我这里速度很好，很快就跑起来了
ios运行
命令行敲flutter doctor -v 试试
我们看到，是有设备的，重启下as试试吧
设备出来了，我们点旁边的run（绿三角）试试吧
后记
整篇文章是我边搭环境边写的
可以说很详细了，中间我还走了xcode版本号的弯路 但是项目后来还是成功的跑起来了，希望各位看我文章的 也能成功可以看到我开始的截图 macos版本是10.12.3
后来安装了新版本 变成了10.13.6我单位的版本是10.12.6 那个macos版本是可以安装xcode 9.0的