前段时间 flutter 发布了1.0版本, 于是我也尝试一下这个前沿技术.
注: 万事开头难, 我用的是Mac, 所以配置环境为Mac 环境

1. 获取flutter代码

$ git clone  https://github.com/flutter/flutter.git

注1: 我下载到了/Users/zwz/Desktop/Demo/目录下, 等会要使用此目录

2. 配置Flutter环境

首页打开.bash_profile

open -e .bash_profile

.bash_profile 中添加

// export PATH=${PATH}:/Users/zwz/Desktop/Demo/flutter/bin:$PATH
注2: 路径使用(注1)的路径


export PATH=${PATH}:/Users/zwz/Desktop/Demo/flutter/bin:$PATH
export ANDROID_HOME="/Users/zwz/Library/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
export PATH=`pwd`/flutter/bin:$PATH
frc e172386c17c6e8e20b194cfc954b81c6 - Flutter 第一步:  flutter 环境配置
配置.jpg

更新配置

source .bash_profile

3. 安装xcode 及 Android Studio (最好都是最新的版本)

4.安装 futter 剩余依赖项

flutter doctor

5. 配置IDE

官方推荐Android StudioVS Code, 我暂时使用的是Android Studio

首先, 如图所示下载Flutter插件

frc 52300e2b36a31a1f17bbee2b20fa32dc - Flutter 第一步:  flutter 环境配置
andrio.png

安装好 Flutter插件后 重启Android Studio会多出一会创建Flutter工程的选项

frc bc53c23bc387109cb8399cee28387b3e - Flutter 第一步:  flutter 环境配置
a2.jpg

点击 start a new Flutter project 需要等待一会儿…..

frc 4ae85689b539a16b7ca44450897154c8 - Flutter 第一步:  flutter 环境配置
a3.jpg

** 重点是选择SDK的目录 **

frc 366a23f7f68e8b359782a1409899f204 - Flutter 第一步:  flutter 环境配置
a4.jpg

又是漫长的等待….

frc 747a61a83e18fe2c6b12ad9788add14c - Flutter 第一步:  flutter 环境配置
a5.jpg

下一篇文章为: flutter 工程文件介绍
参考:
futter官网
futter中文网

Flutter 第一步: flutter 环境配置