在 macOS 上搭建 Flutter 开发环境

在 macOS 上使用 Android Studio 搭建 Flutter 开发环境

系统要求

  • macOS 10.14 (Mojave) 或更高版本

  • 磁盘空间:至少 2.8GB(不包括 IDE/tools)

  • 命令行工具:Git(用于 Flutter 安装和管理)

安装步骤

1. 安装 Android Studio

  1. 下载 Android Studio:
  1. 安装 Android Studio:

```bash

解压下载的 .dmg 文件

将 Android Studio 拖拽到 Applications 文件夹

```

  1. 首次运行 Android Studio 并完成初始设置:
  • 选择 "Standard" 安装类型

  • 确保安装以下组件:

  • Android SDK

  • Android SDK Platform-Tools

  • Android Emulator

2. 安装 Flutter SDK

  1. 下载 Flutter SDK:

```bash

cd ~/development

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

```

> 如果没有 `development` 文件夹,可以创建:`mkdir ~/development`

  1. 将 Flutter 添加到 PATH 环境变量:
  • 打开或创建 `.zshrc` 文件(macOS Catalina 及以后版本使用 zsh):

```bash

nano ~/.zshrc

```

  • 添加以下内容:

```bash

export PATH="PATH:HOME/development/flutter/bin"

```

  • 保存并退出(Ctrl+O, Enter, Ctrl+X)

  • 使更改生效:

```bash

source ~/.zshrc

```

  1. 预下载开发二进制文件:

```bash

flutter precache

```

3. 运行 Flutter Doctor 检查环境

```bash

flutter doctor

```

根据输出解决任何问题(通常会提示安装 Xcode 或接受 Android 许可证)。

4. 安装 Xcode(用于 iOS 开发)

  1. 从 Mac App Store 安装 Xcode

  2. 安装 Xcode 命令行工具:

```bash

xcode-select --install

```

  1. 打开 Xcode 一次以同意许可协议

  2. 确保 Xcode 命令行工具指向正确版本:

```bash

sudo xcode-select -s /Applications/Xcode.app/Contents/Developer

```

5. 安装 Flutter 和 Dart 插件

  1. 启动 Android Studio

  2. 打开插件首选项:

  • `Android Studio > Preferences > Plugins`
  1. 搜索并安装:
  • Flutter 插件(会自动安装 Dart 插件)
  1. 重启 Android Studio

6. 配置 Flutter SDK 路径

  1. 启动 Android Studio

  2. 打开首选项:

  • `Android Studio > Preferences > Languages & Frameworks > Flutter`
  1. 指定 Flutter SDK 路径(例如:`/Users/yourusername/development/flutter`)

  2. 点击 "Apply" 然后 "OK"

创建和运行第一个 Flutter 项目

创建新项目

  1. 选择 `File > New > New Flutter Project`

  2. 选择 `Flutter Application`

  3. 配置项目:

  • Project name: 您的应用名称

  • Flutter SDK path: 应该自动检测到

  • Project location: 项目保存路径

  • Description: 项目描述(可选)

  1. 点击 `Finish`

运行应用

在 iOS 模拟器上运行

  1. 打开终端,运行:

```bash

open -a Simulator

```

  1. 在 Android Studio 的设备选择器中选择 iOS 模拟器

  2. 点击运行按钮或执行 `flutter run`

在 Android 模拟器上运行

  1. 在 Android Studio 中打开 `AVD Manager`

  2. 创建新的虚拟设备(推荐使用 Pixel 系列)

  3. 启动模拟器

  4. 在 Android Studio 的设备选择器中选择 Android 模拟器

  5. 点击运行按钮

在物理设备上运行

**iOS 设备**:

  1. 使用 USB 线连接 iPhone/iPad

  2. 在 Xcode 中信任开发者证书

  3. 在 Android Studio 中选择您的 iOS 设备

  4. 点击运行按钮

**Android 设备**:

  1. 启用设备的开发者选项和 USB 调试

  2. 通过 USB 连接设备到 Mac

  3. 在 Android Studio 中选择您的设备

  4. 点击运行按钮

常见问题解决

  1. **flutter doctor 显示 Android licenses 未接受**:

```bash

flutter doctor --android-licenses

```

然后按提示接受所有许可

  1. **CocoaPods 未安装(iOS 开发需要)**:

```bash

sudo gem install cocoapods

```

  1. **网络问题导致依赖下载失败**:
  • 设置国内镜像(中国大陆用户):

```bash

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

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

```

  1. **权限问题**:

```bash

sudo chown -R $(whoami) ~/development/flutter

```

  1. **Xcode 版本不兼容**:

确保使用 Flutter 支持的 Xcode 版本,可以在 [Flutter 文档](https://flutter.dev/docs) 中查看版本要求

完成以上步骤后,您已成功在 macOS 上的 Android Studio 中搭建了 Flutter 开发环境,可以开始开发跨平台的 Flutter 应用了!

相关推荐
键盘鼓手苏苏10 小时前
Flutter 三方库 p2plib 的鸿蒙化适配指南 - 实现高性能的端到端(P2P)加密通讯、支持分布式节点发现与去中心化数据流传输实战
flutter·harmonyos·鸿蒙·openharmony
加农炮手Jinx10 小时前
Flutter for OpenHarmony:postgrest 直接访问 PostgreSQL 数据库的 RESTful 客户端(Supabase 核心驱动) 深度解析与鸿蒙适配指南
数据库·flutter·华为·postgresql·restful·harmonyos·鸿蒙
加农炮手Jinx10 小时前
Flutter 组件 heart 适配鸿蒙 HarmonyOS 实战:分布式心跳监控,构建全场景保活检测与链路哨兵架构
flutter·harmonyos·鸿蒙·openharmony
钛态10 小时前
Flutter 三方库 http_mock_adapter — 赋能鸿蒙应用开发的高效率网络接口 Mock 与自动化测试注入引擎(适配鸿蒙 HarmonyOS Next ohos)
android·网络协议·flutter·http·华为·中间件·harmonyos
王码码203510 小时前
Flutter for OpenHarmony:Flutter 三方库 algoliasearch 毫秒级云端搜索体验(云原生搜索引擎)
android·前端·git·flutter·搜索引擎·云原生·harmonyos
王码码203510 小时前
Flutter 三方库 dns_client 的鸿蒙化适配指南 - 告别 DNS 劫持、探索 DNS-over-HTTPS (DoH) 技术、构建安全的鸿蒙网络请求环境
flutter·harmonyos·鸿蒙·openharmony·dns_client
键盘鼓手苏苏10 小时前
Flutter 组件 highlighter 适配鸿蒙 HarmonyOS 实战:高性能语法高亮,构建大规模代码分析与文本染色架构
flutter·harmonyos·鸿蒙·openharmony
国医中兴10 小时前
Flutter 三方库 langchain_google 的鸿蒙化适配指南 - 链接 Gemini 智慧中枢、LangChain AI 实战、鸿蒙级智能应用专家
flutter·langchain·harmonyos
左手厨刀右手茼蒿10 小时前
Flutter for OpenHarmony: Flutter 三方库 shamsi_date 助力鸿蒙应用精准适配波斯历法(中东出海必备)
android·flutter·ui·华为·自动化·harmonyos
雷帝木木10 小时前
Flutter 三方库 http_client_interceptor 的鸿蒙化适配指南 - 实现原生 HttpClient 的全量请求拦截、支持端侧动态 Headers 注入与网络流量审计实战
flutter·harmonyos·鸿蒙·openharmony·http_client_interceptor