在 macOS 下安装配置Flutter 开发环境

4371次阅读  |  发布于5年以前

在 macOS 下安装配置Flutter 开发环境

本文为 Flutter 开发环境在 macOS 下安装全过程:

一、系统配置要求

想要安装并运行 Flutter,你的开发环境需要最低满足以下要求:

二、获取 Flutter SDK

  1. 下载以下安装包来获取最新的 stable Flutter SDK:

下载链接:https://storage.flutter-io.cn/flutter_infra/releases/stable/macos/flutter_macos_v1.5.4-hotfix.2-stable.zip

想要获取到其他版本的安装包,可以查看 SDK 归档 页面。

  1. 将文件解压到目标路径, 比如:
$ cd ~/development
$ unzip ~/Downloads/flutter_macos_v1.5.4-hotfix.2-stable.zip
  1. 配置 flutter 的 PATH 环境变量:
$ export PATH="$PATH:`pwd`/flutter/bin"

这个命令配置了 PATH 环境变量,且只会在你 当前 命令行窗口中生效。 如果想让它永久生效,请查看更新 PATH 环境变量。

  1. 开发二进制文件预下载(可选操作)

flutter 命令行工具会下载不同平台的开发二进制文件,如果需要一个封闭式的构建环境,或在网络可用性不稳定的情况下使用等情况,你可能需要通过下面这个命令预先下载 iOS 和 Android 的开发二进制文件:

$ flutter precache

更多使用方式,请使用 flutter help precache 命令查看。

现在你可以愉快地运行 Flutter 的命令行啦!

备忘: 如果想要升级当前的 Flutter 版本,可以查看 升级 Flutter。

2.1 运行 flutter doctor 命令

通过运行以下命令来查看当前环境是否需要安装其他的依赖(如果想查看更详细的输出,增加一个 -v 参数即可):

$ flutter doctor

这个命令会检查你当前的配置环境,并在命令行窗口中生成一份报告。安装 Flutter 会附带安装 Dart SDK,所以不需要再对 Dart 进行单独安装。你需要仔细阅读上述命令生成的报告,看看别漏了一些需要安装的依赖,或者需要之后执行的命令(这个会以 加粗的文本 显示出来)。

比如你可能会看到下面这样的输出:

[-] Android toolchain - develop for Android devices
    • Android SDK at /Users/obiwan/Library/Android/sdk
    ✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
    • Try re-installing or updating your Android SDK,
      visit https://flutter-io.cn/setup/#android-setup for detailed instructions.

之后的部分会向你描述如果执行这些命令来完成整体的配置过程。

当你安装了任一缺失部分的依赖后,可以再次运行 flutter doctor 命令来确认是否成功安装。

flutter 工具使用了 Google Analytics 来对基本使用情况和崩溃报告进行匿名的统计。这些数据用来帮助改善 Flutter 工具。在第一次运行或者任何涉及到 flutter config 的信息都不会进行发送,所以你可以在发送分析数据之前选择禁止分析数据的统计。要禁用这一功能,只需要输入 flutter config --no-analytics 即可,想要查看当前设置使用命令 flutter config 即可。你可以在 Google 隐私政策中查看更详细的内容。

2.2 更新 PATH 环境变量

正如获取 Flutter SDK 一文中所展示你可以仅仅在当前命令行会话中更新你的 PATH 环境变量。但你也许想让这个配置永久生效,这样就可以在任意一个命令行会话中使用 flutter 命令了。

以下配置环境变量让其永久生效的方法在不同的机器上有略微的差别。基本上方法都是在某一个文件中增加一句命令,让它在每次新的命令行窗口打开时都执行一遍。比如:

  1. 首先决定你想要将 Flutter SDK 放置在哪一个目录内,获取并记录这个目录的路径,你将要在第 3 步中用到它。
  2. 打开(或者创建)$HOME/.bash_profile,这里的路径和文件名在你的机器上可能会有所不同。
  3. 在文件中增加下列这行命令,并将其中的 [PATH_TO_FLUTTER_GIT_DIRECTORY] 更改为你第一步获取到的路径:
$ export PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"
  1. 运行 source $HOME/.bash_profile 来刷新当前命令行窗口。

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

$ echo $PATH

想要查看更加详细的内容,请查看 StackExchange 中的一个提问

三、平台配置

macOS 可以允许开发 iOS 和 Android 两个平台的 Flutter 应用,你可以任选一个平台完成初始配置,以此来搭建并运行起来你的第一个 Flutter 应用。

四、设置 iOS 开发环境

4.1 安装 Xcode

开发 iOS 平台上的 Flutter 应用,你需要一个安装了 Xcode 9.0 或者更高版本的 Mac 设备:

  1. 通过直接下载或者 Mac App Store 来安装 Xcode 9.0 或者更高版本;

下载链接:https://developer.apple.com/xcode/

  1. 通过在命令行中运行以下命令来配置 Xcode command-line tools:
$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

当你安装了最新版本的 Xode,大部分情况下,上面的路径都是一样的。但如果你安装了不同版本的 Xcode,你可能要更改一下上述命令中的路径。

  1. 运行一次 Xocde 或者通过输入命令 sudo xcodebuild -license 来确保已经同意 Xcode  的许可协议。

安装了 Xcode 之后,你就可以在 iOS 真机或者模拟器上运行 Flutter 应用了。

4.2 配置 iOS 模拟器

如果想要在 iOS 模拟器中运行和测试 Flutter 应用,按照以下步骤即可:

  1. 在你的 Mac 中,通过 Spotlight 或者以下命令来运行模拟器:
$ open -a Simulator
  1. 通过模拟器菜单中的 Hardware > Device 选项检查当前模拟器是否是 64 位机型(iPhone 5S 或之后的机型)。

  2. 根据你当前开发机器的屏幕尺寸,模拟器模拟出来的高密度屏幕的设备可能会占满你的屏幕,你可以通过菜单中的 Window > Scale 选项来更改模拟器的缩放比例。

4.3 创建并运行一个简单的 Flutter 应用

通过以下步骤来创建你的第一个 Flutter 应用并进行测试:

  1. 通过运行以下命令来创建一个新的 Flutter 应用:
$ flutter create my_app
  1. 上述命令创建了一个 my_app 的目录,包含了 Flutter 初始的应用模版,切换路径到这个目录内:
$ cd my_app
  1. 确保模拟器已经处于运行状态,输入以下命令来启动应用:
$ flutter run

4.4 部署到 iOS 真机上

如果你想把 Flutter 应用部署到 iOS 的真机上,你还需要一些别的工具和一个 Apple 开发者账号。另外,你还需要在 Xcode 上针对你的机器做一些设置。

  1. 安装 homebrew

homebrew 安装链接:https://brew.sh/

  1. 确保 homebrew 已经是最新版以及确保所有 formula 都已经更新:
$ brew update
  1. 通过运行以下命令来安装将 Flutter 应用分发到 iOS 真机的工具:
$ brew install --HEAD usbmuxd
$ brew link usbmuxd
$ brew install --HEAD libimobiledevice
$ brew install ideviceinstaller ios-deploy cocoapods
$ pod setup

如果运行上述命令报错了,运行以下 brew doctor 命令,并通过命令给出的报告来解决相应的问题。

  1. 按照Xcode签名流程来配置你的项目:

  2. 通过在命令行中于你当前 Flutter 项目目录下运行 open ios/Runner.xcworkspace 命令来打开默认的 Xcode 工程。

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

  4. 在 Runner 项目的设置页面中,确保 General > Signing > Team 选项下的 Development Team 选中状态。当你选择一个 team 后,Xcode 会为其创建并下载相应的 Development Certificate,并将你的账号在设备上进行注册,然后根据实际需求进行 provisioning profile 的配置。

任何 Apple ID 都可以进行开发和测试。如果想将应用上架 App Store,你需要加入 Apple Developer Program,你可以在 Choosing a Membership 页面中查看详细的说明

然后在 iOS 开发机上进入 Settings 应用,选择 General > Device Management然后信任相应的证书。

5. 执行 flutter run 命令来运行你的应用。

五、设置 Android 开发环境

备忘: Flutter 依赖 Android Studio 的全量安装来为其提供 Android 平台的支持。 但你也可以使用其他的编辑器来写 Flutter 应用,稍后会说明讨论这个问题。

5.1 安装 Android Studio

  1. 下载并安装 Android Studio。

下载链接:https://developer.android.google.cn/studio

  1. 运行 Android Studio,并进入 ‘Android Studio Setup Wizard’,这会安装最新的 Android SDK, Android SDK Platform-Tools 以及 Android SDK Build-Tools,这些都是在开发 Android Flutter 应用时所需要的。

5.2 配置 Android 设备

在 Android 设备上运行或测试 Flutter 应用之前,你需要一个运行 Android 4.1(API 版本 16)或者更高的设备。

  1. 在设备上打开 Developer options 和 USB debugging 选项,你可以在 Android documentation 上查看更详细的方法介绍。

  2. 如果是在 Windows 平台上使用,需要安装 Google USB Driver

安装链接:

https://developer.android.google.cn/studio/run/win-usb

  1. 通过 USB 接口连接手机和电脑,如果在设备上弹出需要授权弹窗,允许授权以便让电脑能够访问你的开发设备。

  2. 在命令行中,使用 flutter devices 命令来确保 Flutter 能够识别出你所连接的 Android 设备。

默认情况下,Flutter 会使用当前版本 adb 工具所依赖的 Android SDK 版本,如果你想让 Flutter 使用别的 Android SDK,你可以通过设置 ANDROID_HOME 环境变量来达到目的。

5.3 配置 Android 模拟器

根据以下步骤来将 Flutter 应用运行或测试于你的 Android 模拟器上:

  1. 激活机器上的 VM acceleration 选项。

  2. 启动 Android Studio > Tools > Android > AVD Manager,然后选择 Create Virtual Device选项。(只有在 Android 项目中才会显示 Android 子选项。)

  3. 选择相应的设备并选择 Next 选项。

  4. 选择一个或多个你想要模拟的 Android 版本的系统镜像,然后选择 Next 选项。推荐选择 x86或者 x86_64 镜像。

  5. 在 Emulated Performance 下选择 Hardware - GLES 2.0 选项来开启 硬件加速。

  6. 确保 AVD 选项配置正确,并选择 Finish 选项。

想要查看上述步骤的更多详细信息,请查看 Managing AVDs 页面。

  1. 在 Android Virtual Device Manager 中,点击工具栏中的 Run 选项,模拟器会启动并为你所选择的系统版本和设备显示出相应的界面。

Copyright© 2013-2020

All Rights Reserved 京ICP备2023019179号-8