macOS上搭建Flutter开发环境及真机调试

获取Flutter SDK

1. 去flutter官网下载其最新可用的安装包，转到下载页 。

   注意，Flutter的渠道版本会不停变动，请以Flutter官网为准。另外，在中国大陆地区，要想正常获取安装包列表或下载安装包，可能需要翻墙，读者也可以去Flutter github项目下去下载安装包，转到下载页 。

2. 解压安装包到你想安装的目录，如：

   cd ~/Users/nav/wanglh/flutteSdk
   unzip ~/Users/nav/wanglh/flutteSdk/flutter_macos_v1.9.1+hotfix.5-stable.zip
   

即将压缩包解压到flutteSdk目录下。

image.png

更新环境变量

vim编辑bash_profile文件：

1. 确定您Flutter SDK的目录，您将在步骤3中用到。
2. 打开(或创建) $HOME/.bash_profile. 文件路径和文件名可能在您的机器上不同.
3. 添加以下行并更改[PATH_TO_FLUTTER_GIT_DIRECTORY]为克隆Flutter的git repo的路径:

export PUB_HOSTED_URL=https://pub.flutter-io.cn //国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //国内用户需要设置
export PATH=PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH

注意：PATH_TO_FLUTTER_GIT_DIRECTORY 为你flutter的路径，比如我的目录路径是：“~/Users/nav/wanglh/flutteSdk/”

 export PATH=~/Users/nav/wanglh/flutteSdk/flutter/bin:$PATH

效果如下：

image.png

运行 flutter doctor

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

flutter doctor

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

例如:

image.png

一般的错误会是xcode或Android Studio版本太低、或者没有ANDROID_HOME环境变量等，请按照提示解决。下面贴一个笔者本机(mac)的环境变量配置，您可以对比修正：

  export PATH=/Users/用户名/Documents/flutter/flutter/bin:$PATH
  export ANDROID_HOME="/Users/用户名/Documents/android_sdk" //android sdk目录，替换为你自己的即可
  export PATH=${PATH}:${ANDROID_HOME}/tools
  export PATH=${PATH}:${ANDROID_HOME}/platform-tools
  export PUB_HOSTED_URL=https://pub.flutter-io.cn
  export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

第一次运行一个flutter命令（如flutter doctor）时，它会下载它自己的依赖项并自行编译，比较慢，耐心等待。以后再运行就会快得多。

以下各部分介绍如何执行这些任务并完成设置过程。你会看到在flutter doctor输出中， 如果你选择使用IDE，我们提供了，IntelliJ IDEA，Android Studio和VS Code的插件， 请参阅编辑器设置 以了解安装Flutter和Dart插件的步骤。

一旦你安装了任何缺失的依赖，再次运行flutter doctor命令来验证你是否已经正确地设置了。

检查flutter配置是否成功

flutter -h

如果你能看到如下页面，就代表成功了

image.png
image.png

平台设置

macOS支持为iOS和Android开发Flutter应用程序。现在完成两个平台设置步骤中的至少一个，以便能够构建并运行您的第一个Flutter应用程序

iOS 设置

安装 Xcode

要为iOS开发Flutter应用程序，您需要Xcode 7.2或更高版本:

1. 安装Xcode 7.2或更新版本(通过链接下载或苹果应用商店).

2. 配置Xcode命令行工具以使用新安装的Xcode版本 sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer 对于大多数情况，当您想要使用最新版本的Xcode时，这是正确的路径。如果您需要使用不同的版本，请指定相应路径。

3. 确保Xcode许可协议是通过打开一次Xcode或通过命令sudo xcodebuild -license同意过了.

使用Xcode，您可以在iOS设备或模拟器上运行Flutter应用程序。

设置iOS模拟器

要准备在iOS模拟器上运行并测试您的Flutter应用，请按以下步骤操作：

1. 在Mac上，通过Spotlight或使用以下命令找到模拟器:

   open -a Simulator
   
   

2. 通过检查模拟器 硬件>设备 菜单中的设置，确保您的模拟器正在使用64位设备（iPhone 5s或更高版本）.

3. 根据您的开发机器的屏幕大小，模拟的高清屏iOS设备可能会使您的屏幕溢出。在模拟器的 Window> Scale 菜单下设置设备比例

4. 运行 flutter run启动您的应用.

安装到iOS设备

要将您的Flutter应用安装到iOS真机设备，您需要一些额外的工具和一个Apple帐户，您还需要在Xcode中进行设置。

1. 安装 homebrew （如果已经安装了brew,跳过此步骤）.

2. 打开终端并运行这些命令来安装用于将Flutter应用安装到iOS设备的工具

   brew update
   brew install --HEAD libimobiledevice
   brew install ideviceinstaller ios-deploy cocoapods
   pod setup
   
   

如果这些命令中的任何一个失败并出现错误，请运行brew doctor并按照说明解决问题.

1. 遵循Xcode签名流程来配置您的项目:

   1. 在你Flutter项目目录中通过 open ios/Runner.xcworkspace 打开默认的Xcode workspace.

   2. 在Xcode中，选择导航面板左侧中的Runner项目

   3. 在Runner target设置页面中，确保在 常规>签名>团队 下选择了您的开发团队。当您选择一个团队时，Xcode会创建并下载开发证书，向您的设备注册您的帐户，并创建和下载配置文件（如果需要）

      • 要开始您的第一个iOS开发项目，您可能需要使用您的Apple ID登录Xcode.

        
        Xcode account add

        任何Apple ID都支持开发和测试。需要注册Apple开发者计划才能将您的应用分发到App Store. 查看differences between Apple membership types.

      • 当您第一次attach真机设备进行iOS开发时，您需要同时信任你的Mac和该设备上的开发证书。首次将iOS设备连接到Mac时,请在对话框中选择 Trust。

        Trust Mac

        然后，转到iOS设备上的设置应用程序，选择 常规>设备管理 并信任您的证书。

      • 如果Xcode中的自动签名失败，请验证项目的 General > Identity > Bundle Identifier 值是否唯一.

      Check the app's Bundle ID

2. 运行启动您的应用程序 flutter run.

Android设置

安装Android Studio

要为Android开发Flutter应用，您可以使用Mac，Windows或Linux（64位）机器.

Flutter需要安装和配置Android Studio:

1. 下载并安装 Android Studio.

2. 启动Android Studio，然后执行“Android Studio安装向导”。这将安装最新的Android SDK，Android SDK平台工具和Android SDK构建工具，这是Flutter为Android开发时所必需的

设置您的Android设备

要准备在Android设备上运行并测试您的Flutter应用，您需要安装Android 4.1（API level 16）或更高版本的Android设备.

1. 在您的设备上启用 开发人员选项 和 USB调试 。详细说明可在Android文档中找到。
2. 使用USB将手机插入电脑。如果您的设备出现提示，请授权您的计算机访问您的设备。
3. 在终端中，运行 flutter devices 命令以验证Flutter识别您连接的Android设备。
4. 运行启动您的应用程序 flutter run。

默认情况下，Flutter使用的Android SDK版本是基于你的 adb 工具版本。 如果您想让Flutter使用不同版本的Android SDK，则必须将该 ANDROID_HOME 环境变量设置为SDK安装目录。

设置Android模拟器

要准备在Android模拟器上运行并测试您的Flutter应用，请按照以下步骤操作：

1. 在您的机器上启用 VM acceleration .

2. 启动 Android Studio>Tools>Android>AVD Manager 并选择 Create Virtual Device.

3. 选择一个设备并选择 Next。

4. 为要模拟的Android版本选择一个或多个系统映像，然后选择 Next. 建议使用 x86 或 x86_64 image .

5. 在 Emulated Performance下, 选择 Hardware - GLES 2.0 以启用 硬件加速.

6. 验证AVD配置是否正确，然后选择 Finish。

   有关上述步骤的详细信息，请参阅 Managing AVDs.

7. 在 Android Virtual Device Manager中, 点击工具栏的 Run。模拟器启动并显示所选操作系统版本或设备的启动画面.

8. 运行 flutter run 启动您的设备. 连接的设备名是 Android SDK built for <platform>,其中 platform 是芯片系列, 如 x86.

创建你的flutter应用

flutter create myflutter

注意：项目名的要求：

image.png

运行你的flutter项目

cd myflutter
flutter run

注意：首次使用命名进行运行flutter时，会报错：

image.png

原因是没有设备可以运行（包含模拟器和真机），先调出模拟器，在Mac上，通过Spotlight或使用以下命令找到模拟器:
open -a Simulator

模拟器打开后，二次运行，并体验热加载模式（press 'r'）

flutter run

image.png

项目运行：

image.png

参考：
https://flutter.dev/docs/get-started/install
https://flutterchina.club/setup-macos/#运行-flutter-doctor