flutter 安装详细教程

发表于2018-06-30 15:18 阅读(133)

Flutter Google 用以帮助开发者在 iOS Android 两个平台开发高质量原生 UI 的移动 SDKFlutter 兼容现有的代码,免费且开源,在全球开发者中广泛被使用。

安装步骤:

1.由于国内被墙,需要设置下载镜像

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

2.github下载flutter

git clone -b dev https://github.com/flutter/flutter.git

3.设置flutter为全局可执行

export PATH="$PWD/flutter/bin:$PATH"

4.安装flutter所需相关依赖(可能安装时间较长,请耐心等待)

完毕之后可能会有issues提示,部分工具或依赖未安装。

我在安装完毕之后

1.提示需要android studioios toolchainIntelij等,这三个工具选择安装其一即可,我选择的是安装andriod studio sdkissue上有下载地址。

下载andriod studio也较慢,需要耐心等待(本人通过代理下载)。

下载完毕之后,执行flutter doctor -v,查看,提示你为andriod sdk变量未配置

配置andriod studio sdk环境变量

vim ~/.bash_profile

添加变量配置

export ANDROID_HOME=/Users/bytedance/Library/Android/sdk // 这个路径可以通过issue提示获取
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
export PATH=$HOME/flutter/bin:$PATH  

保存然后执行:

source ~/.bash_profile

  此时在执行flutter doctor -v,可以看到提示变量已配置

注意: 如果你使用的是zsh,终端启动时 ~/.bash_profile 将不会被加载,每次都必须source一次才能起作用,很烦。解决办法就是修改 /.zshrc ,在其中添加:source /.bash_profile,完美解决。

2.还有提示Android licenses问题,按照描述执行指令,一直同意即可

3)在android sdk配置后变量之后,还提示需要安装flutter plugindart plugin

打开android studio,选择右上角菜单 android studio => Preferences=>Plugins 搜索安装flutterdart即可

5.如果顺利通过前四步,基本算是大功告成了吧。(不确定是否遗漏什么,主要还是通过flutter doctor -v查漏补缺)

6. 设置Android模拟器

要准备在Android模拟器上运行并测试您的Flutter应用,请按照以下步骤操作:
在您的机器上启用 VM acceleration .
启动 Android Studio 顶部菜单Tools > AVD Manager 并选择 Create Virtual Device.
选择一个设备并选择 Next
为要模拟的Android版本选择一个或多个系统映像,然后选择 Next. 建议使用 x86 x86_64 image .
Emulated Performance下, 选择 Hardware - GLES 2.0 以启用 硬件加速.
验证AVD配置是否正确,然后选择 Finish

7.创建你的第一个flutter app

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

  然后你的flutter开发生涯就完美的开始了😄

附上flutter中文教程 https://flutterchina.club/get-started/codelab/

github 地址 https://github.com/flutter/flutter

编写app简要教程 https://codelabs.flutter-io.cn/codelabs/first-flutter-app-pt1-cn/index.html#0