两分钟带你快速搭建Flutter开发环境(Mac)

为你们倾力打造的课程《Flutter从入门到进阶-实战携程网App》上线了,解锁Flutter开发新姿式,一网打尽Flutter核心技术 点我Get!!!html

在这篇文章中,将带着你们一块儿在Mac平台上快速搭建Flutter的开发环境同时会将搭建Flutter开发环境中的一些技巧和经验分享给你们。android

  • 在你们Flutter开发环境过程当中遇到没法解决的问题能够在课程问答区进行提问,课程老师会对你进行辅导和帮助;

目录


  • 系统要求
  • 设置FLutter镜像(非必须)
  • 获取Flutter SDK
  • iOS开发环境设置
  • Android开发环境设置
  • 安装Flutter插件

系统要求

在Mac上要安装并运行Flutter要知足如下最低要求:ios

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

设置FLutter镜像(非必须)

因为在国内访问Flutter可能会受到限制,Flutter官方为中国开发者搭建了临时镜像,你们能够将以下环境变量加入到用户环境变量中:git

//Macintosh HD⁩  ⁨Users⁩  ⁨你的用户名  ⁨.bash_profile
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
复制代码

注意:此镜像为临时镜像,并不能保证一直可用,你们能够从 Using Flutter in China 上得到有关镜像服务器的最新动态。macos

获取Flutter SDK

1.点Flutter官网下载其最新可用的安装包。vim

2.解压安装包到你想安装的目录,如:xcode

$ cd ~/development
$ unzip ~/Downloads/flutter_macos_v1.2.1-stable.zip
复制代码

3.添加flutter相关工具到path中:bash

export PATH="$PATH:`pwd`/flutter/bin"
复制代码

此代码只能暂时针对当前命令行窗口设置PATH环境变量,要想永久将Flutter添加到PATH中请参考下面作法:服务器

$ cd ~
$ vim .bash_profile
复制代码

而后添加:网络

export PATH=/Users/jph/Documents/flutter/bin:$PATH
复制代码

以后记得保存文件。

运行 flutter doctor

上面path配置完成以后,须要关闭终端从新打开,而后运行:

$ 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.dev/setup/#android-setup for detailed instructions.
复制代码

通常的错误会是XCode或Android Studio版本过低、或者没有ANDROID_HOME环境变量等,可参考一下环境变量的配置来检查你的环境变量:

//Macintosh HD⁩  ⁨Users⁩  ⁨你的用户名  ⁨.bash_profile
#Android 环境变量
export ANDROID_HOME=/Users/你的用户名/Library/Android/sdk
#Android 模拟器路径
export PATH=${PATH}:${ANDROID_HOME}/emulator
#Android tools 路径
export PATH=${PATH}:${ANDROID_HOME}/tools
#Android 平台工具路径
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
#Android NDK路径
ANDROID_NDK_HOME=/Users/你的用户名/Library/Android/ndk/android-ndk-r10e
#FLutter镜像
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
#Flutter环境变量
export PATH=/Users/jph/Documents/flutter/bin:$PATH
复制代码

第一次运行一个flutter命令(如flutter doctor)时,它会下载它本身的依赖项并自行编译。之后再运行就会快得多。

iOS开发环境设置

安装 Xcode

要用Flutter开发iOS App须要Xcode 9.0 或更高版本:

1.安装Xcode 9.0或更新版本(经过连接下载苹果应用商店)

2.配置Xcode命令行工具以使用新安装的Xcode版本 s

$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
复制代码

以上路径时对于最新版Xcode的路径。若是你须要使用不一样的Xcode版本,须要指定相应路径。

3.确保Xcode许可协议是经过打开一次Xcode或经过命令sudo xcodebuild -license赞成过了

接下来就可使用Xcode,在iOS设备或模拟器上运行Flutter App了。

设置iOS模拟器

要准备在iOS模拟器上运行并测试您的Flutter应用,请按如下步骤操做:

1.在终端输入以下命令打开一个iOS模拟器:

$ open -a Simulator
复制代码

2.经过模拟器菜单栏的 硬件>设备 ,确保你打开是64位 iPhone 5s或更新的模拟器

3.若是模拟器过大,能够经过模拟器的 Window> Scale 菜单下设置设备比例

建立和运行一个简单的Flutter项目

1.经过以下命令建立一个Flutter项目

$ flutter create my_app
复制代码

2.命令运行完成以后会在当前目录下建立一个名为my_app的Flutter项目,而后经过一下命令能够运行它:

$ cd my_app
$ flutter run
复制代码

如何将Flutter安装到iOS真机上?

要经过lutter run将Flutter应用安装到iOS真机设备,须要一些额外的工具和一个Apple账户,还须要在Xcode中进行设置:

固然,用XCode来将Flutter运行在真机上更简单,只须要点一下run按钮便可,能够根据须要进行选择这两种不一样的运行方式;

1.安装 Homebrew (若是已经安装了brew,跳过此步骤).

2.确保homebrew已更新

$ brew update
复制代码

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

$ brew install --HEAD usbmuxd
$ brew link usbmuxd
$ brew install --HEAD libimobiledevice
$ brew install ideviceinstaller ios-deploy cocoapods
$ pod setup
复制代码

若是这些命令中的任何一个失败并出现错误,可运行brew doctor并按照说明解决问题。

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

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

  • 在Xcode中,选择导航面板左侧中的Runner项目

  • 在Runner target设置页面中,确保在 常规>签名>团队 下选择了您的开发团队。当您选择一个团队时,Xcode会建立并下载开发证书,向您的设备注册您的账户,并建立和下载配置文件(若是须要)

    • 要开始您的第一个iOS开发项目,您可能须要使用您的Apple ID登陆Xcode
      xcode-account
      任何Apple ID都支持开发和测试,但若是要将应用发布到App Store则须要一个99美刀的开发者帐号。
  • 当你第一次attach真机设备进行iOS开发时,须要同时信任你的Mac和该设备上的开发证书。首次将iOS设备链接到Mac时,请在对话框中选择 Trust

    trust-computer

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

  • 若是Xcode中的自动签名失败,请验证项目的 General > Identity > Bundle Identifier 值是否惟一。

5.经过flutter run运行启动项目

$ flutter run
复制代码

Android开发环境设置&Flutter插件安装

安装Android Studio

1.下载并安装 Android Studio

由于Android网站设在国外,若是你的网络没法访问第一个地址,能够选择使用Google为中国开发者提供的中国网址进行访问。

另外,关于Android Studio的安装和配置,Android官方有比较详细的说明文档developer.android.google.cn/studio/intr…,你们能够根据须要进行查阅;

你们在安装过程当中遇到问题没法解决的,能够在咱们课程的问答区提问进行提问;

2.启动Android Studio,而后执行“Android Studio安装向导”。这将安装最新的Android SDK,Android SDK平台工具和Android SDK构建工具

Flutter插件安装

  • 打开Android Studio
  • 打开Preferences > Plugins (macOS), File > Settings > Plugins (Windows & Linux)
  • 选择 Browse repositories, 搜索 Flutter plugin
  • 而后点击安装,而后安装Dart插件
  • 完成以后选择重启Android Studio

如何在Android模拟器上运行Flutter?

要准备在Android模拟器上运行并测试您的Flutter应用,须要按照如下步骤操做:

  • 在你的机器上启用 VM acceleration

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

  • 选择一个设备并选择 Next;

  • 为要模拟的Android版本选择一个或多个系统映像,而后选择 Next. 建议使用 x86 或 x86_64 的镜像;

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

  • 验证AVD配置是否正确,而后选择 Finish;

    若是对以上步骤还有不清楚的能够参阅Android官方的 Managing AVDs文档。

    你们在安装过程当中遇到问题没法解决的,能够在咱们课程的问答区提问进行提问;

  • 在 Android Virtual Device Manager中, 点击工具栏的 Run,模拟器启动并显示所选操做系统版本或设备的启动画面;
  • 经过flutter run运行启动项目;

如何在Android真机运行?

要准备在Android设备上运行并测试您的Flutter应用,您须要安装Android 4.1(API level 16)或更高版本的Android设备

  • 在你的设备上启用 开发人员选项USB调试 。详细说明可在Android文档中找到;
  • 使用USB将手机插入电脑,若是有受权提示须要赞成受权;
  • 在终端中,运行flutter devices 命令以验证Flutter是否识别你链接的Android设备;
  • 经过flutter run运行启动项目;

默认状况下,Flutter使用的Android SDK版本是基于你的 adb 工具版本, 若是你想让Flutter使用不一样版本的Android SDK,则必须将该 ANDROID_HOME 环境变量修改SDK的目录。

关于开发环境搭建更多实战技巧与最佳实践可学习《基于Flutter1.x开发携程网App-开发环境搭建》部分的课程。

  • 本节学习过程当中遇到没法解决的问题能够在课程问答区进行提问,课程老师会对你进行辅导和帮助;

参考

相关文章
相关标签/搜索