清晰易懂的 Flutter 开发环境搭建教程

Flutter 是 Google 推出的跨平台应用开发框架,支持 iOS/Android/Web/桌面应用开发。本教程将手把手教你完成 Windows/macOS/Linux 环境下的 Flutter 安装与配置,从零到运行第一个应用,全程避坑指南!


一、安装 Flutter SDK

1. 下载 Flutter SDK

  1. 访问官网下载页面:https://flutter.dev/docs/get-started/install
  2. 根据系统选择安装包:
    • Windowsflutter_windows_3.xx.x-stable.zip
    • macOSflutter_macos_3.xx.x-stable.zip
    • Linuxflutter_linux_3.xx.x-stable.tar.xz

2. 解压并配置环境变量

  1. 将压缩包解压到目标目录(建议路径无空格和中文):
    • WindowsC:\src\flutter
    • macOS/Linux~/development/flutter
  2. 配置环境变量:
    • Windows

      • 右键"此电脑" → 属性 → 高级系统设置 → 环境变量 → 编辑 Path → 添加 C:\src\flutter\bin
    • macOS/Linux

      bash 复制代码
      echo 'export PATH="$PATH:$HOME/development/flutter/bin"' >> ~/.bashrc  # 或 ~/.zshrc
      source ~/.bashrc

3. 验证安装

bash 复制代码
flutter --version
# 输出示例:Flutter 3.13.9 • channel stable • ...

二、安装平台依赖

1. Windows 用户

  1. 安装 Android Studio
    • 勾选 Android SDKAndroid EmulatorAndroid SDK Platform-Tools
  2. 安装 Visual Studio
    • 勾选 "使用 C++ 的桌面开发"(用于 Windows 桌面应用编译)

2. macOS 用户

  1. 安装 Xcode:

    bash 复制代码
    xcode-select --install  # 安装命令行工具
    sudo xcodebuild -license  # 接受 Xcode 许可协议
  2. 安装 CocoaPods(iOS 依赖管理):

    bash 复制代码
    sudo gem install cocoapods

3. Linux 用户

bash 复制代码
sudo apt-get install clang cmake ninja-build libgtk-3-dev

三、配置 Android 开发环境

1. 安装 Android Studio

  1. 下载并安装 Android Studio
  2. 打开 Android Studio → 安装 FlutterDart 插件:
    • File → Settings → Plugins → 搜索安装

2. 配置 Android SDK

  1. 打开 Android Studio → Tools → SDK Manager
  2. 确保安装以下组件:
    • Android SDK 33+
    • Android SDK Platform-Tools
    • Android Emulator

3. 接受 Android 许可证

bash 复制代码
flutter doctor --android-licenses  # 按提示输入 y 确认

四、运行第一个 Flutter 应用

1. 创建项目

bash 复制代码
flutter create my_first_app
cd my_first_app

2. 启动模拟器

bash 复制代码
flutter emulators --launch Pixel_5_API_33  # 或连接真实设备

3. 运行应用

bash 复制代码
flutter run
# 看到手机屏幕显示 "Hello World" 即成功!

五、国内用户加速配置

1. 配置镜像环境变量

bash 复制代码
# Windows:在系统环境变量中添加
# macOS/Linux:添加到 ~/.bashrc 或 ~/.zshrc
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

2. 切换 Flutter 国内镜像源

bash 复制代码
flutter channel stable
flutter config --enable-web
flutter config --android-sdk /path/to/android/sdk  # 指定 Android SDK 路径

六、新手必看:容易忽略的坑点

1. 未安装平台工具链

  • 现象flutter doctor 提示 Android toolchainXcode 未配置
  • 解决:根据提示安装对应组件(如 Android SDK Build-Tools)

2. 模拟器无法启动

  • 现象flutter emulators 列表为空
  • 解决:通过 Android Studio → AVD Manager 创建虚拟设备

3. iOS 编译失败(macOS)

  • 现象pod install 报错

  • 解决

    bash 复制代码
    sudo arch -x86_64 gem install ffi  # Apple Silicon 芯片需额外步骤
    cd ios && pod install

4. 网络问题导致依赖下载失败

  • 现象flutter pub get 卡住
  • 解决
    • 确认镜像环境变量已配置
    • 使用代理工具(如 Clash)设置全局代理

七、开发工具推荐

工具 用途
VS Code 轻量级代码编辑器(安装 Flutter/Dart 插件)
Android Studio 官方 IDE,集成模拟器和调试工具
Xcode iOS 应用编译与发布(仅 macOS)

八、总结

通过本教程,你已经:

  1. 完成 Flutter SDK 安装与环境变量配置
  2. 配置 Android/iOS 开发环境
  3. 创建并运行首个 Flutter 应用
  4. 掌握国内加速配置方案

下一步建议

  • 学习 Dart 语言基础(官方文档
  • 尝试 Flutter Widget 库(Widget Catalog
  • 探索跨平台功能(如调用摄像头、访问网络)

遇到问题可查阅 Flutter 中文文档 或留言讨论! 🚀

相关推荐
大筒木老辈子20 小时前
Linux笔记---计算机网络概述
linux·笔记·计算机网络
李火火的安全圈20 小时前
【系统安全】Windows文件资源管理器欺骗漏(CVE-2025-24054、CVE-2025-50154)
windows
keep__go21 小时前
postgresql9.2.4 跨版本升级14.6
linux·运维·数据库·postgresql
深思慎考21 小时前
LinuxC++项目开发日志——高并发内存池(1-定长内存池)
linux·c++
伐尘1 天前
【mac】如何在 macOS 终端中高效查找文件:五种实用方法
运维·macos
川石课堂软件测试1 天前
Oracle 数据库如何查询列
linux·数据库·sql·功能测试·oracle·grafana·prometheus
humiaor1 天前
Flutter之riverpod状态管理详解
flutter·provider·riverpod
光电的一只菜鸡1 天前
ubuntu之坑(十九)——VMware虚拟机扩容磁盘
linux·数据库·ubuntu
岚天start1 天前
网络计算工具ipcalc详解
linux·运维·网络·网关·广播地址·掩码·ipcalc
deeper_wind1 天前
Jenkins主机中安装ansible部署lnmp论坛(小白的”升级打怪“成长之路)
linux·ansible·jenkins