清晰易懂的 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 中文文档 或留言讨论! 🚀

相关推荐
Tee xm1 小时前
清晰易懂的跨平台 MySQL 安装与配置教程
linux·windows·mysql·macos·安装
GalaxyPokemon1 小时前
MySQL基础 [一] - Ubuntu版本安装
linux·运维·ubuntu
musk12121 小时前
wsl2 配置ubuntu 固定ip
linux·tcp/ip·ubuntu
柳鲲鹏1 小时前
UBUNTU编译datalink
linux·运维·ubuntu
追随远方1 小时前
Ubuntu 64-bit 交叉编译 FFmpeg(高级用户指南)
linux·ubuntu·ffmpeg
GalaxyPokemon1 小时前
Muduo网络库实现 [七] - Connection模块
linux·服务器·网络
无尽星海max1 小时前
M芯片,能运行普通应用程序的原架构虚拟机
windows·架构
the_nov2 小时前
19.TCP相关实验
linux·服务器·网络·c++·tcp/ip
Y淑滢潇潇3 小时前
RHCSA Linux 系统创建文件
linux·运维·服务器
University of Feriburg3 小时前
4-c语言中的数据类型
linux·c语言·笔记·学习·嵌入式实时数据库·嵌入式软件