1、Mac新建文件夹，如命名为：Flutter，然后打开终端，cd到Flutter目录下，执行：git clone https://github.com/flutter/flutter.git
2、如图，文件夹Flutter目录下就有一个新项目flutter:
图1
3、添加环境变量，参考链接：配置Mac环境变量
在配置文件中加上：
export PUB_HOSTED_URL=https://pub.flutter-io.cn //国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //国内用户需要设置
export PATH=“flutter代码路径”/flutter/bin:$PATH
4、终端cd到flutter目录下，执行：flutter doctor，查看终端输出，按照提示逐个解决
图2
我这边因为之前安装过Xcode与Android Studio及Visual Studio Code等三个编辑器，所以这里提示报错文件不多。这里指出的是Android Studio未安装Flutter及Dark插件，配置一下即可。
5、Android Studio插件配置：
a、启动Android Studio。
b、打开插件首选项 (Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux)。
c、搜索框选择 Flutter 插件并点击 install。
d、重启Android Studio后插件生效。
6、VS Code插件配置：
a、启动 VS Code
b、调用 View>Command Palette…
c、输入 ‘install’, 然后选择 Extensions: Install Extension action
d、在搜索框输入 flutter , 在搜索结果列表中选择 ‘Flutter’, 然后点击 Install
e、选择 ‘OK’ 重新启动 VS Code
7、新建一个Flutter项目：这里以VS Code编辑器为例
a、打开 VS Code，使用快捷键command+shift+P打开命令面板，选择Flutter: New Project（如图3），提示新建flutter项目名称，这里我以smallaflutterdemo为名，等待配置完成即可。
图3
配置完成之后，VS Code打印应如图4所示：
图4
创建完成，回到桌面查看文件目录，如图5，代表一个新的Flutter Demo项目创建完成。
图5
8、开发调试：
未连接真机或者打开模拟器时，这里显示No Device（如图6），
图6
a、iOS真机调试：这里我直接连接手机之后，直接显示对应平台及机型，如图7所示：
图7
按快捷键F5或点击左上角菜单栏"调试"->"启动调试"，等待项目运行，我这边控制台运行结果如下：
图8
查看真机运行情况，可以正常run，这样FlutterDemo项目就在真机上正式跑起来了。
b、iOS模拟器调试：通过Spotlight搜索关键字"Simulator"，enter打开，这里以iPhone XS为例：
图9
选择相关模拟器，可以正常run，表示FlutterDemo在模拟器上运行成功。
c、Android真机调试调试，以MIX 3为例：用Android Studio打开名为 smallaflutterdemo项目，选择真机MIX 3，选择对应main.dart，再点击小甲壳虫（debug模式），等待编译运行即可，这样一个flutterdemo项目就在Android真机上运行起来。
图10
d、Android模拟器调试：选择Android标识，下载Android模拟器，下载完成之后，点击对应Actions下的执行按钮，启动模拟器，启动完成之后，编译器里面的调试设备选择就会有模拟器选项，选择对应模拟器，然后执行run即可。
图11
图12
网友评论