Flutter环境搭建和应用的创建

Mac 上Flutter的环境搭建和iOS开发环境

参考:官网

参考:Mac环境

参考: windows环境

1. 系统要求
2. 设置Flutter镜像:如果可以很好的访问外网就不用设置镜像
3. 获取Flutter SDK
4. ios 开发环境设置
5. Android 开发环境的设置
  • 系统要求
Mac 上的要求
1. 操作系统: macOS (64-bit)
2. 磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间).
3.工具: Flutter 依赖下面这些命令行工具.
bash, mkdir, rm, git, curl, unzip, which
  • 设置Flutter镜像(不是必须的)
// 这个是个临时的镜像,我们可以将如下环境变量加入到用户环境变量中:
// Macintosh HD -> Users -> 你的用户名 -> .bash_profile
// 终端下  open ~ 可以打开.bash_profile
export PUB_HOSTED_URL=https://pub.flutter-io.cn

export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
  • 获取Flutter SDK
1. 到官网下载最新的flutter安装包
[下载地址](https://flutter.io/sdk-archive/#macos)
[github地址](https://github.com/flutter/flutter/releases)
2. 解压下载的安装包到你指定的路径:
cd到指定路径,执行解压的操作

cd ~/development
unzip ~/Downloads/flutter_macos_v0.5.1-beta.zip

比如我放置的路径:/Users/zhouyujuan/flutter
3. 添加flutter相关工具到path中
(1)打开.bash_profile文件
添加如下的环境设置:
// 注意这里在bin之前都是一个全路径
export PATH=/Users/zhouyujuan/flutter/bin:$PATH 
export FLUTTER_ROOT=/Users/zhouyujuan/flutter
export PUB_HOSTED_URL=https://pub.flutter-io.cn
  • 运行 flutter doctor 检查是否需要安装其他的依赖
    查看安装图1 按照提示进行更新

Android Studio 的下载和配置

Android Studio下载地址:http://www.android-studio.org/
  1. 更新Android的SDK
    查看安装图3
  2. 下载对应的flutter的插件
    查看安装图4

通过上面的步骤,重启Android Studio 这时就可以使用Android Studio创建Flutter项目了。

安装Xcode

open -a Simulator
  • 配置完成后,再次使用flutter doctor 进行检验
    查看安装图2

  • VSCode

1. 安装 Flutter
2. 安装 Dart

使用命令行创建一个flutter项目

flutter create my_app
cd my_app
flutter run
// 如果我们没有关联到设备。
flutter emulators  // 查看下模拟器的列表
flutter emulators --launch iOS Simultaor // 启动一个模拟器
flutter run此时项目就可以启动起来了。
  • 此时项目可以在VSCode中运行起来。
  • To hot reload changes while running, press “r”.修改后按r就可以更新
  • To hot restart (and rebuild state), press “R”. 重新运行按R

使用Android Studio创建和运行一个项目

Start a new Flutter project 
Flutter Application -> next
定义Project name  Project locaton
定义包名:Package name
  • 运行,选择一个设备,点击run就可以直接运行
  • 更改信息后,保存更改,就可以在模拟器直接看到效果。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值