mac 搭建 Flutter 开发环境

2021-05-14 16:00:57 浏览数 (1)

最近由于业务需要，开始进行 Flutter 的研究，由于 Flutter 的环境搭建在官网上有些细节不是很清楚，笔者重新整理输出

1. 配置镜像

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

  • vim ~/.bash_profile
  • 输入 i 进入编辑模式，复制粘贴添加下面的环境变量
代码语言：javascript复制
# flutter 镜像
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
  • 按 esc 进入命令模式，输入 :wq 退出保存
  • 执行 source ~/.bash_profile 使配置生效

2. 下载 Flutter SDK

下载稳定的 1.22.6版本到本地：Flutter SDK 2.0.5 https://storage.googleapis.com/flutter_infra/releases/stable/macos/flutter_macos_2.0.5-stable.zip

3. 配置 Flutter SDK 环境

  • 下载完之后解压，然后将 flutter sdk 放入 /Library 目录
  • 在环境变量中添加 path，方便访问 flutter sdk（具体步骤和第 1 步类似）
代码语言：javascript复制
# 链接 flutter sdk
export PATH="$PATH:/Library/flutter/bin"
  • 配置完成之后执行下面命令，就会自动检查并配置 flutter 环境
代码语言：javascript复制
flutter doctor
  • 根据执行结果，自行将环境完善即可

4. 创建一个 Flutter 项目并运行

▐ 4.1 终端

最简单的方法是终端直接输入下面的命令即可快速创建一个 flutter 应用并运行起来

代码语言：javascript复制
flutter create myapp
cd myapp
flutter run
代码语言：javascript复制
▐ 4.2 Android Studio
  • 安装插件： https://flutter.cn/docs/get-started/editor?tab=androidstudio
  • 创建/运行项目： https://flutter.cn/docs/get-started/test-drive?tab=androidstudio
▐ 4.3 VSCode
  • 安装插件
  • 创建项目

cmd shift p 打开命令面板，输入 Flutter，选择 Flutter: New Application Project 即可创建一个 flutter 应用

  • 运行项目

使用 VSCode 打开项目，cmd shift p 打开命令面板，输入 Flutter选择 Flutter: Run Flutter Docktor 将应用运行起来

flutter ios android https 网络安全

0 人点赞