Flutter开发环境安装指南

卢叁2025-08-11 11:58

Flutter开发环境安装指南

📋 目录

🖥️ 系统要求

macOS版本要求

  • 最低版本: macOS 10.14 (Mojave) 或更高版本

  • 推荐版本: macOS 11.0 (Big Sur) 或更高版本

  • 最新版本: macOS 14.0 (Sonoma) 或更高版本

硬件要求

  • 处理器: Intel Core i5 或 Apple Silicon (M1/M2/M3)

  • 内存: 至少 8GB RAM (推荐 16GB)

  • 磁盘空间: 至少 15GB 可用空间 (推荐 20GB)

  • 网络: 稳定的网络连接用于下载SDK和依赖

推荐配置

  • 处理器: Apple Silicon (M1/M2/M3) 芯片
  • 内存: 16GB 或更高
  • 存储: SSD 硬盘，50GB 可用空间
  • 网络: 高速网络连接

注：若能科学上网最好，否则安装相应镜像

📥 安装步骤

1. 安装Homebrew (如果未安装)

bash 复制代码 
# 安装Homebrew包管理器
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

# 验证安装
brew --version

若提示失败，按以下操作：

bash 复制代码 
sudo vim /etc/hosts
185.199.108.133 raw.githubusercontent.com

2. 安装Flutter SDK

方法一: 使用Homebrew安装 (推荐)
bash 复制代码 
# 使用Homebrew安装Flutter
brew install --cask flutter

# 验证安装
flutter --version
方法二: 手动下载安装
bash 复制代码 
# 创建开发目录
mkdir -p ~/development
cd ~/development

# 下载Flutter SDK
curl -O https://storage.googleapis.com/flutter_infra_release/releases/stable/macos/flutter_macos_3.x.x-stable.zip

# 解压Flutter SDK
unzip flutter_macos_3.x.x-stable.zip

# 验证安装
~/development/flutter/bin/flutter --version

3. 配置环境变量

配置Shell环境
bash 复制代码 
# 确定你使用的Shell
echo $SHELL

# 如果使用zsh (macOS Catalina及以后版本的默认Shell)
echo 'export PATH="$PATH:$HOME/development/flutter/bin"' >> ~/.zshrc
source ~/.zshrc

# 如果使用bash
echo 'export PATH="$PATH:$HOME/development/flutter/bin"' >> ~/.bash_profile
source ~/.bash_profile

# 验证PATH配置
echo $PATH | grep flutter

4. 安装依赖工具

安装Xcode
perl 复制代码 
# 从App Store安装Xcode
# 或使用命令行安装
xcode-select --install

# 验证Xcode安装
xcode-select --print-path
安装Git
csharp 复制代码 
# 使用Homebrew安装Git
brew install git

# 或从官网下载: https://git-scm.com/download/mac

# 配置Git用户信息
git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"
安装Android Studio
shell 复制代码 
# 使用Homebrew安装Android Studio
brew install --cask android-studio

# 或从官网下载: https://developer.android.com/studio
安装CocoaPods
bash 复制代码 
# 安装CocoaPods (iOS开发必需)
sudo gem install cocoapods

# 验证安装
pod --version

⚙️ 环境配置

1. 配置iOS开发环境

配置Xcode
csharp 复制代码 
# 设置Xcode命令行工具路径
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

# 接受Xcode许可协议
sudo xcodebuild -license accept

# 验证Xcode配置
xcodebuild -version
安装iOS模拟器
perl 复制代码 
# 打开Xcode
open -a Xcode

# 在Xcode中安装模拟器:
# 1. 打开 Xcode > Window > Devices and Simulators
# 2. 选择 Simulators 标签
# 3. 点击 "+" 按钮添加新的模拟器
# 4. 选择设备类型和iOS版本
配置CocoaPods
bash 复制代码 
# 初始化CocoaPods
pod setup

# 验证CocoaPods配置
pod --version

2. 配置Android开发环境

安装Android SDK
ini 复制代码 
# 打开Android Studio
open -a "Android Studio"

# 在Android Studio中安装SDK:
# 1. 打开 Android Studio > Preferences > Appearance & Behavior > System Settings > Android SDK
# 2. 安装以下组件:
#    - Android SDK Platform-Tools
#    - Android SDK Build-Tools (最新版本)
#    - Android SDK Platform (API 33+)
#    - Android SDK Command-line Tools
#    - Android Emulator
配置Android环境变量(可跳过)
bash 复制代码 
# 编辑Shell配置文件
# 如果使用zsh
echo 'export ANDROID_HOME=$HOME/Library/Android/sdk' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/platform-tools' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/tools' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/emulator' >> ~/.zshrc

# 如果使用bash
echo 'export ANDROID_HOME=$HOME/Library/Android/sdk' >> ~/.bash_profile
echo 'export PATH=$PATH:$ANDROID_HOME/platform-tools' >> ~/.bash_profile
echo 'export PATH=$PATH:$ANDROID_HOME/tools' >> ~/.bash_profile
echo 'export PATH=$PATH:$ANDROID_HOME/emulator' >> ~/.bash_profile

# 重新加载配置
source ~/.zshrc  # 或 source ~/.bash_profile

3. 配置Flutter

bash 复制代码 
# 运行Flutter doctor检查环境
flutter doctor

# 接受Android许可协议
flutter doctor --android-licenses

# 升级Flutter到最新版本
flutter upgrade

# 配置Flutter镜像源 (中国用户)
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

🛠️ IDE配置

1. Android Studio (强烈推荐)

安装Android Studio
shell 复制代码 
# 使用Homebrew安装Android Studio
brew install --cask android-studio

# 或从官网下载: https://developer.android.com/studio
# 下载macOS版本并安装
首次启动配置
perl 复制代码 
# 1. 启动Android Studio
open -a "Android Studio"

# 2. 完成初始设置向导:
#    - 选择 "Standard" 安装类型
#    - 选择UI主题 (推荐 "Darcula" 深色主题)
#    - 等待下载和安装Android SDK
安装Flutter插件
bash 复制代码 
# 在Android Studio中安装必需插件:
# 1. 打开 Android Studio > Preferences (或按 Cmd+,)
# 2. 选择 Plugins
# 3. 搜索并安装以下插件:
#    - Flutter Plugin (官方插件，必需)
#    - Dart Plugin (官方插件，必需)
#    - Flutter Enhancement Suite (推荐)
#    - Flutter Widget Snippets (推荐)
#    - Awesome Flutter Snippets (推荐)
# 4. 重启Android Studio
配置Flutter SDK路径
shell 复制代码 
# 在Android Studio中配置Flutter SDK:
# 1. 打开 Android Studio > Preferences
# 2. 选择 Languages & Frameworks > Flutter
# 3. 设置Flutter SDK路径:
#    - 如果使用Homebrew安装: /opt/homebrew/bin/flutter
#    - 如果手动安装: ~/development/flutter
# 4. 点击 "Apply" 和 "OK"
配置Android SDK
csharp 复制代码 
# 在Android Studio中配置Android SDK:
# 1. 打开 Android Studio > Preferences
# 2. 选择 Appearance & Behavior > System Settings > Android SDK
# 3. 在 SDK Platforms 标签页安装:
#    - Android 14.0 (API 34)
#    - Android 13.0 (API 33)
#    - Android 12.0 (API 31)
# 4. 在 SDK Tools 标签页安装:
#    - Android SDK Build-Tools
#    - Android SDK Platform-Tools
#    - Android SDK Command-line Tools
#    - Android Emulator
#    - Intel x86 Emulator Accelerator (HAXM installer)
创建Android虚拟设备 (AVD)
shell 复制代码 
# 在Android Studio中创建模拟器:
# 1. 打开 Tools > AVD Manager
# 2. 点击 "Create Virtual Device"
# 3. 选择设备类型 (推荐 Pixel 7)
# 4. 选择系统镜像 (推荐 API 34)
# 5. 配置AVD名称和设置
# 6. 点击 "Finish"
Android Studio优化设置
arduino 复制代码 
// 在Android Studio中优化设置:
// 1. 打开 Preferences > Editor > General
// 2. 启用 "Auto Import" 和 "Optimize imports on the fly"
// 3. 在 Preferences > Editor > Code Style > Dart 中设置:
//    - Line separator: Unix and OS X (\n)
//    - Right margin: 80
// 4. 在 Preferences > Editor > Inspections 中启用:
//    - Dart > General > Unused import
//    - Dart > General > Unused local variable

2. VS Code (备选方案)

安装VS Code
css 复制代码 
# 使用Homebrew安装VS Code
brew install --cask visual-studio-code

# 或从官网下载: https://code.visualstudio.com/
安装扩展
bash 复制代码 
# 打开VS Code，安装以下必需扩展:
# 1. Flutter (官方扩展)
# 2. Dart (官方扩展)
# 3. Flutter Widget Snippets
# 4. Awesome Flutter Snippets
# 5. Flutter Intl (国际化支持)
# 6. Error Lens (错误提示增强)
配置设置
json 复制代码 
// 在VS Code中按 Cmd+Shift+P，输入 "Preferences: Open Settings (JSON)"
{
    "dart.flutterSdkPath": "/opt/homebrew/bin/flutter",
    "dart.sdkPath": "/opt/homebrew/bin/cache/dart-sdk",
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll": true
    },
    "dart.lineLength": 80,
    "dart.previewFlutterUiGuides": true,
    "dart.previewFlutterUiGuidesCustomTracking": true
}

3. Xcode (iOS开发必需)

配置Xcode
bash 复制代码 
# 确保Xcode已正确安装和配置
# 在Xcode中安装iOS模拟器:
# 1. 打开 Xcode > Window > Devices and Simulators
# 2. 选择 Simulators 标签
# 3. 添加所需的iOS模拟器:
#    - iPhone 15 Pro (推荐)
#    - iPhone 14
#    - iPad Pro (11-inch)

🎯 为什么推荐Android Studio？

Android Studio的优势

  1. 官方支持: Flutter官方推荐的IDE，获得最佳支持

  2. 完整工具链: 集成Android SDK、模拟器、调试工具

  3. 智能提示: 强大的代码补全和错误检测

  4. 可视化调试: 内置Flutter Inspector和性能分析工具

  5. 热重载: 完美的热重载支持，开发效率高

  6. 插件生态: 丰富的Flutter和Dart插件

  7. 多平台支持: 同时支持iOS、Android、Web开发

  8. 团队协作: 适合团队开发，配置统一

与VS Code的对比

特性 Android Studio VS Code
官方支持 ✅ 官方推荐 ⚠️ 社区支持
开箱即用 ✅ 配置简单 ⚠️ 需要额外配置
性能分析 ✅ 内置工具 ⚠️ 需要插件
调试体验 ✅ 优秀 ✅ 良好
资源占用 ⚠️ 较高 ✅ 较低
启动速度 ⚠️ 较慢 ✅ 快速

✅ 验证安装

1. 运行Flutter Doctor

复制代码 
flutter doctor -v

**预期输出: **

less 复制代码 
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.x.x, on macOS 14.0, locale zh-CN)
[✓] macOS Version (Installed version of macOS is version 10.14 or higher)
[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
[✓] Chrome - develop for the web (Chrome version 119.0.6045.105)
[✓] Android Studio (version 2023.1.1)
[✓] VS Code (version 1.84.2)
[✓] Connected device (3 available)
[✓] Network resources

• No issues found!

注意: Android Studio 是Flutter官方推荐的IDE，提供最完整的Flutter开发体验。

bash 复制代码 
### 2. 创建测试项目
```bash
# 创建新项目
flutter create my_first_app

# 进入项目目录
cd my_first_app

# 运行项目
flutter run

3. 测试不同平台

iOS (推荐优先测试)
perl 复制代码 
# 启动iOS模拟器
open -a Simulator

# 运行iOS应用
flutter run -d ios

# 或指定特定模拟器
flutter devices  # 查看可用设备
flutter run -d "iPhone 15 Pro"  # 指定设备
Android
bash 复制代码 
# 启动Android模拟器
# 在Android Studio中: Tools > AVD Manager > 启动模拟器

# 或使用命令行启动
emulator -avd Pixel_7_API_34  # 替换为你的AVD名称

# 运行Android应用
flutter run -d android
macOS桌面应用
arduino 复制代码 
# 启用macOS桌面支持
flutter config --enable-macos-desktop

# 运行macOS应用
flutter run -d macos
Web
shell 复制代码 
# 启动Web开发服务器
flutter run -d chrome

# 或使用Safari
flutter run -d web-server
# 然后在Safari中访问 http://localhost:8080

🔧 常见问题

1. Flutter Doctor 显示问题

Xcode问题
csharp 复制代码 
# 解决方案
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -license accept

# 如果仍有问题，尝试重新安装Xcode命令行工具
sudo rm -rf /Library/Developer/CommandLineTools
xcode-select --install
Android License问题
shell 复制代码 
# 解决方案
flutter doctor --android-licenses
# 对所有提示输入 'y' 接受
CocoaPods问题
bash 复制代码 
# 如果CocoaPods安装失败
sudo gem uninstall cocoapods
sudo gem install cocoapods -n /usr/local/bin

# 或使用Homebrew安装
brew install cocoapods

# 初始化CocoaPods
pod setup
Git问题
csharp 复制代码 
# 确保Git已正确安装
git --version

# 配置Git用户信息
git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"

2. 网络连接问题

设置镜像源 (中国用户)
bash 复制代码 
# 设置Flutter镜像
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

# 或添加到环境变量文件
echo 'export PUB_HOSTED_URL=https://pub.flutter-io.cn' >> ~/.bash_profile
echo 'export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn' >> ~/.bash_profile
代理设置
bash 复制代码 
# 设置HTTP代理
export HTTP_PROXY=http://proxy.example.com:8080
export HTTPS_PROXY=http://proxy.example.com:8080

# 设置Flutter代理
flutter config --proxy http://proxy.example.com:8080

3. 权限问题

macOS权限问题
bash 复制代码 
# 修复Flutter目录权限
sudo chown -R $(whoami) ~/development/flutter
chmod +x ~/development/flutter/bin/flutter

# 修复Homebrew权限问题
sudo chown -R $(whoami) /opt/homebrew
sudo chown -R $(whoami) /usr/local

# 如果使用Intel Mac
sudo chown -R $(whoami) /usr/local
安全设置问题
shell 复制代码 
# 如果遇到"无法验证开发者"错误
# 1. 打开 系统偏好设置 > 安全性与隐私
# 2. 点击"仍要打开"或"允许"
# 3. 或在终端中运行
sudo spctl --master-disable

4. 依赖下载失败

csharp 复制代码 
# 清理缓存
flutter clean
flutter pub cache clean

# 重新获取依赖
flutter pub get

# 如果仍有问题，尝试
flutter pub cache repair

🚀 下一步

1. 学习资源

2. 开发工具

3. 社区资源

4. 创建第一个应用

bash 复制代码 
# 创建新项目
flutter create my_app

# 运行项目
cd my_app
flutter run

# 开始开发!

📝 注意事项

  1. 定期更新: 保持Flutter SDK和相关工具的最新版本

  2. 备份配置: 备份重要的环境配置和项目文件

  3. 网络稳定: 确保网络连接稳定，特别是在下载SDK和依赖时

  4. 权限管理: 注意文件系统权限，避免权限相关的问题

  5. 版本兼容: 确保Flutter、Dart和相关工具的版本兼容性

  6. macOS 特定:

    1. 确保Xcode版本与macOS版本兼容
    2. 定期更新Xcode和命令行工具
    3. 注意Apple Silicon和Intel芯片的差异

  7. 存储空间: 确保有足够的磁盘空间，Xcode和模拟器会占用大量空间

  8. 安全设置: 在macOS安全设置中允许开发者工具运行

🆘 获取帮助

如果在安装过程中遇到问题，可以通过以下方式获取帮助：

祝您在 macOS 上Flutter开发愉快！ 🎉

🍎 macOS特有优势

使用macOS进行Flutter开发的优势：

  1. 原生iOS开发: 可以直接开发和测试iOS应用
  2. 性能优化: Apple Silicon芯片提供优秀的性能表现
  3. 工具集成: 与Xcode、Safari等原生工具完美集成
  4. 多平台支持: 可以同时开发iOS、Android、Web和macOS应用
  5. 开发体验: macOS提供了优秀的开发体验和工具链

Happy Flutter Development on macOS ! 🚀

相关推荐
Lsx_21 分钟前
分不清RAG 、Function Call、MCP、Agent？一文秒懂它们的区别和联系
前端·agent·mcp
毕了业就退休42 分钟前
websocket 的心跳机制你知道几种
前端·javascript·http
子林super43 分钟前
aiforcast集群单节点CPU使用率100%问题
前端
CF14年老兵44 分钟前
为什么 position: absolute 在 Flexbox 里会失效？
前端·css·trae
xianxin_1 小时前
CSS 选择器
前端
徐小夕1 小时前
花3个月时间，写了一款协同文档编辑器
前端·vue.js·算法
Nicholas681 小时前
flutter滚动视图之ScrollDirection、ViewportOffset源码解析(一)
前端
Dream耀1 小时前
FitKick 电商APP项目总结二
前端·javascript·react.js
ZsTs1191 小时前
一篇通关：从 MVVM 到渲染优化，Vue 基础核心 5 大模块全解析
前端·vue.js·面试
石小石Orz1 小时前
视差悬停特效：鼠标跟随的沉浸式交互体验
前端·css·trae
热门推荐
01全球最强模型Grok4，国内已可免费使用！（附教程）02[已解决]VSCode右键菜单消失恢复03Qwen3-Coder 快速上手教程 | Qwen Code + Claude Code04UV安装并设置国内源05🚀Cursor CLI+GPT-5保姆级教程+编程能力测评！Cursor CLI零成本免费使用GPT-5！Claude Code的劲敌来了！从安装到实战演示06GPT-5 使用限制与国内升级全攻略（免费 / Plus / Pro）【2025 最新】07KGG转MP3工具|非KGM文件|解密音频08OpenAI重返开源！GPT-OSS本地部署完全指南092025年华数杯C题超详细解题思路10Cursor 终端“卡死/无响应”问题的解法