第2章 - 环境搭建

嗨，朋友！我是长安。

上一章我们认识了 Flutter，现在该动手搭建开发环境了！别担心，我会一步步带你完成，保证你能顺利跑起来第一个 Flutter 程序。

🤔 需要准备什么？

在开始之前，确保你的电脑满足以下要求：

操作系统	最低要求
Windows	Windows 10 或更高版本（64位）
macOS	macOS 10.15 (Catalina) 或更高版本
Linux	64 位 Linux 发行版

另外需要准备：

硬盘空间：至少 10GB（推荐 20GB 以上）
内存：至少 8GB（推荐 16GB）
网络：需要能访问外网（下载 SDK 和包）

📥 第一步：安装 Flutter SDK

Windows 安装

下载 Flutter SDK

访问 Flutter 官网下载页面：https://flutter.dev/docs/get-started/install/windows

下载最新的稳定版 zip 压缩包。

解压到合适的位置

# 推荐解压到以下位置（避免中文路径！）
C:\flutter

注意

路径中不要包含中文和空格，否则可能出现奇怪的问题！

配置环境变量

把 Flutter 的 bin 目录添加到系统 PATH：

C:\flutter\bin

配置方法：

右键"此电脑" → 属性 → 高级系统设置 → 环境变量
在"用户变量"中找到 Path，点击编辑
新建，粘贴 C:\flutter\bin
确定保存

验证安装

打开新的命令提示符（PowerShell 或 CMD），运行：

flutter --version

如果看到版本信息，说明安装成功！

Flutter 3.38.0 • channel stable • https://github.com/flutter/flutter.git
Framework • revision xxxxxxx
Engine • revision xxxxxxx
Tools • Dart 3.10.0

macOS 安装

下载 Flutter SDK

# 使用 Homebrew 安装（推荐）
brew install flutter

# 或者手动下载
# 访问 https://flutter.dev/docs/get-started/install/macos

配置环境变量

如果手动下载，需要配置 PATH：

# 编辑 ~/.zshrc 或 ~/.bash_profile
export PATH="$PATH:$HOME/flutter/bin"

# 使配置生效
source ~/.zshrc

验证安装

flutter --version

🔧 第二步：运行 Flutter Doctor

Flutter 提供了一个超级好用的诊断工具 flutter doctor，它会检查你的开发环境是否配置正确。

flutter doctor

运行后你会看到类似这样的输出：

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.38.0)
[✓] Windows Version (Installed version of Windows is 10 or higher)
[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
[✗] Chrome - develop for the web (Cannot find Chrome executable)
[✓] Visual Studio - develop Windows apps
[✗] Android Studio (not installed)
[✓] VS Code (version 1.85.0)
[!] Connected device
    ! No devices available

! Doctor found issues in 3 categories.

别被这些 ❌ 吓到！我们一个个来解决。

📱 第三步：安装 Android 开发环境

要开发 Android 应用，需要安装 Android Studio。

1. 下载安装 Android Studio

访问：https://developer.android.com/studio

下载并安装 Android Studio。安装过程中，确保勾选：

Android SDK
Android SDK Platform
Android Virtual Device (AVD)

2. 配置 Android SDK

打开 Android Studio：

点击 More Actions → SDK Manager
在 SDK Platforms 标签页，勾选最新的 Android 版本
在 SDK Tools 标签页，确保勾选：
- Android SDK Build-Tools
- Android SDK Command-line Tools
- Android Emulator
- Android SDK Platform-Tools

3. 接受 Android 许可证

flutter doctor --android-licenses

一路输入 y 接受所有许可证。

4. 创建 Android 模拟器

打开 Android Studio
点击 More Actions → Virtual Device Manager
点击 Create Device
选择一个手机型号（推荐 Pixel 6）
选择系统镜像（推荐最新稳定版）
完成创建

🍎 第四步：安装 iOS 开发环境（仅 macOS）

如果你用的是 macOS，还可以开发 iOS 应用。

1. 安装 Xcode

从 App Store 下载安装 Xcode（大约 12GB）。

2. 配置 Xcode

# 安装命令行工具
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

# 接受许可证
sudo xcodebuild -license accept

3. 安装 CocoaPods

sudo gem install cocoapods

4. 创建 iOS 模拟器

打开 Xcode → Window → Devices and Simulators → 点击左下角 + 号创建模拟器。

💻 第五步：安装代码编辑器

推荐使用 VS Code，轻量又强大！

1. 下载安装 VS Code

访问：https://code.visualstudio.com/

2. 安装 Flutter 插件

打开 VS Code
点击左侧扩展图标（或按 Ctrl+Shift+X）
搜索 Flutter
安装官方的 Flutter 插件（作者是 Dart Code）

这个插件会自动安装 Dart 插件，提供：

代码高亮
智能提示
代码补全
调试支持
热重载快捷键

推荐插件

除了 Flutter 插件，我还推荐安装：

Error Lens：在代码行内显示错误信息
Bracket Pair Colorizer：括号彩色配对
Material Icon Theme：好看的文件图标

✅ 第六步：验证环境

再次运行 flutter doctor：

flutter doctor

理想情况下，你应该看到：

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.38.0)
[✓] Android toolchain - develop for Android devices
[✓] Xcode - develop for iOS and macOS (macOS only)
[✓] Chrome - develop for the web
[✓] Android Studio
[✓] VS Code
[✓] Connected device (1 available)

• No issues found!

小贴士

不需要所有项都打勾！根据你的开发需求：

只开发 Android：需要 Android toolchain ✓
只开发 iOS：需要 Xcode ✓（仅 macOS）
只开发 Web：需要 Chrome ✓

🔥 常见问题解决

问题1：flutter 命令找不到

原因：环境变量没配置好

解决：

确认 flutter 目录位置
重新配置 PATH 环境变量
重启终端或电脑

问题2：Android SDK 找不到

原因：SDK 路径没配置

解决：

# 设置 Android SDK 路径
flutter config --android-sdk /path/to/android/sdk

问题3：下载太慢

原因：网络问题

解决：配置国内镜像

# Windows (PowerShell)
$env:PUB_HOSTED_URL="https://pub.flutter-io.cn"
$env:FLUTTER_STORAGE_BASE_URL="https://storage.flutter-io.cn"

# macOS/Linux
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn