在macOS上搭建Flutter开发环境

建站技巧 嗨APP 3661浏览

使用镜像

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

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

注意: 此镜像为临时镜像,并不能保证一直可用,读者可以参考详情请参考 Using Flutter in China 以获得有关镜像服务器的最新动态。

系统要求

要安装并运行Flutter,您的开发环境必须满足以下最低要求:

  • 操作系统: macOS (64-bit)
  • 磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间).
  • 工具: Flutter 依赖下面这些命令行工具.
    • bash, mkdir, rm, git, curl, unzip, which

获取Flutter SDK

  1. 去flutter官网下载其最新可用的安装包,转到下载页 。注意,Flutter的渠道版本会不停变动,请以Flutter官网为准。另外,在中国大陆地区,要想正常获取安装包列表或下载安装包,可能需要翻墙,读者也可以去Flutter github项目下去下载安装包,转到下载页
  2. 解压安装包到你想安装的目录,如:
    cd ~/development
    unzip ~/Downloads/flutter_macos_v0.5.1-beta.zip
    
  3. 添加flutter相关工具到path中:
    export PATH=`pwd`/flutter/bin:$PATH
    

    此代码只能暂时针对当前命令行窗口设置PATH环境变量,要想永久将Flutter添加到PATH中请参考下面更新环境变量 部分。

注意: 由于一些flutter命令需要联网获取数据,如果您是在国内访问,由于众所周知的原因,直接访问很可能不会成功。 上面的PUB_HOSTED_URLFLUTTER_STORAGE_BASE_URL是google为国内开发者搭建的临时镜像。详情请参考 Using Flutter in China

要更新现有版本的Flutter,请参阅升级Flutter

运行 flutter doctor

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

flutter doctor

该命令检查您的环境并在终端窗口中显示报告。Dart SDK已经在捆绑在Flutter里了,没有必要单独安装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/setup/#android-setup for detailed instructions.

一般的错误会是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工具使用Google Analytics匿名报告功能使用情况统计信息和基本崩溃报告。 这些数据用于帮助改进Flutter工具。Analytics不是一运行或在运行涉及flutter config的任何命令时就发送, 因此您可以在发送任何数据之前退出分析。要禁用报告,请执行flutter config --no-analytics并显示当前设置,然后执行flutter config。 请参阅Google的隐私政策

更新环境变量

您在命令行只能更新当前会话的PATH变量,如Clone Flutter repo所示。 但是,您可能需要的是永久更新此变量,以便您可以运行flutter命令在任何终端会话中。

对于所有终端会话永久修改此变量的步骤是和特定计算机系统相关的。通常,您会在打开新窗口时将设置环境变量的命令添加到执行的文件中。例如

  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的路径,比如“~/document/code”

 export PATH=~/document/code/flutter/bin:$PATH
  1. 运行 source $HOME/.bash_profile 刷新当前终端窗口.
注意: 如果你使用的是zsh,终端启动时 ~/.bash_profile 将不会被加载,解决办法就是修改 ~/.zshrc ,在其中添加:source ~/.bash_profile

5.通过运行flutter/bin命令验证目录是否在已经在PATH中:

echo $PATH

更多详细信息,请参阅this StackExchange question.

编辑器设置

使用 flutter 命令行工具,您可以使用任何编辑器来开发Flutter应用程序。输入flutter help在提示符下查看可用的工具。

我们建议使用我们的插件来获得丰富的IDE体验,支持编辑,运行和调试Flutter应用程序。请参阅编辑器设置了解详细步骤

平台设置

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启动您的应用.

转载请注明:刘玲的个人技术文章 » 在macOS上搭建Flutter开发环境