在MacOS上搭建Flutter开发环境

参考：Flutter、Flutter中文网

笔者是一名iOSer，所以本文接下来记录搭建Flutter环境的过程是建立在电脑上已经安装了iOS开发相关工具，且已安装了Android Studio、IDEA。即使没有安装也不应担心，因为安装上述相关工具很简单，直接移步至参考链接网址即可详见。在此基础上搭建过程很快捷，全程十几分钟。

获取Flutter SDK

去flutter官网下载其最新可用的安装包，读者也可以去Flutter github项目下去下载安装包。
解压安装包到你想安装的目录，笔者安装路径为用户根目录，命令行查看根目录：
```
echo ~   
// 笔者电脑跟目录：/Users/yxy
```

本文下载的版本：flutter_macos_v1.9.1+hotfix.6-stable.zip。
Flutter SDK 放置在哪一个目录内，获取并记录这个目录的路径，稍后会用到。

flutter存放路径.jpg

配置镜像、环境变量

由于在国内访问Flutter有时可能会受到限制，Flutter官方为中国开发者搭建了临时镜像，大家可以将如下环境变量加入到用户环境变量中：

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

添加flutter相关工具到PATH环境变量中，配置环境变量让其永久生效，在任意一个命令行会话中使用 flutter 命令:

// `pwd`:刚刚记录的flutter SDK安装路径
export PATH="$PATH:`pwd`/flutter/bin"

配置环境变量具体操作：

打开或者创建 shell 的 rc 文件，比如，在 Linux 和 macOS Mojave 或 Mojave 之前的系统里，是默认使用 Bash 的，所以需要修改 HOME/.zshrc 文件。请知晓，如果你使用不同的 shell，文件目录或文件名可能会有所不同。
命令查看当前正在使用什么shell：

$ echo $SHELL

笔者用的是.zsh，命令查看zsh的安装目录

$ which zsh

1、更改zsh配置文件：

$ vim ~/.zshrc

2、将上述提到的镜像及flutter环境变量同时复制粘贴到.zshrc中（如下图）保存并退出：

镜像及环境变量配置.png

图中的 $HOME即为电脑用户根目录路径，也就是flutter安装路径：/Users/yxy，读者根据实际安装路径调整。

3、执行命令使刚配置的环境变量生效：

$  source ~/.zshrc

4、验证一下flutter环境有没有配置成功，输入：

$ flutter -h

看到如下如的打印信息就是配置成功:

验证.png

通过运行以下命令来验证 flutter/bin 文件夹是否已经添加到 PATH 环境变量中：

$ echo $PATH

验证 flutter 命令是否可用，可以执行下面的命令检测：

$ which flutter

image.png

运行 flutter doctor

运行以下命令查看是否需要安装其它依赖项来完成安装：

$ flutter doctor

该命令检查您的环境并在终端窗口中显示报告。Dart SDK已经在捆绑在Flutter里了，没有必要单独安装Dart。仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务（以粗体显示）例如:

查看依赖.jpg

笔者电脑安装了Android Studio、IDEA，所以检测出这两个开发工具没有安装flutter插件

平台配置

macOS 可以允许开发 iOS、Android 和 Web（技术预览版正式发布）三个平台的 Flutter 应用，你可以任选一个平台完成初始配置，以此来搭建并运行起来你的第一个 Flutter 应用。本文以Android Studio为列。

Android Studio配置: 为Flutter提供完整的IDE体验
安装两个插件:
Flutter插件：支持Flutter开发工作流 (运行、调试、热重载等).
Dart插件：提供代码分析 (输入代码时进行验证、代码补全等).
安装过程如下：

打开 Android Studio。
打开插件设置（macOS 系统打开 Preferences > Plugins， Windows 和 Linux 系统打开 File > Settings > Plugins）。
选择 Marketplace，然后选择 Flutter 插件并点击安装。
当弹出安装 Dart 插件提示时，点击 Yes。
当弹出重新启动提示时，点击 Restart。

安装插件.jpg

开发体验初探

创建新应用

1、选择 File>New Flutter Project
2、选择 Flutter application 作为 project 类型, 然后点击 Next
3、输入项目名称 (如 flutter_app), 然后点击 Next
4、点击 Finish
5、等待Android Studio安装SDK并创建项目.

上述命令创建一个Flutter项目，项目名为flutter_app，其中包含一个使用Material 组件的简单演示应用程序。
在项目目录中，您应用程序的代码位于 lib/main.dart.

运行应用程序

1、定位到Android Studio 工具栏
2、在 target selector 中, 选择一个运行该应用的Android设备. 如果没有列出可用，请选择 Tools>Android>AVD Manager 并在那里创建一个
3、在工具栏中点击 Run图标, 或者调用菜单项 Run > Run.
如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序:

image.png

image.png