Flutter 环境搭建与工具链

要点

Flutter 的”安装”和多数工具不一样:没有安装器、不写注册表,本质是解压一个自带 Dart SDK 的目录并把它挂进 PATH。装完之后只有两件事要做:国内网络先配两个镜像环境变量,然后用 flutter doctor 把体检报告一条条对绿。你要跑哪个目标平台,就只关心哪几行——不做 iOS 的人,Xcode 那行红着完全不影响写 Android。

系统要求

操作系统 Windows 10(64 位)以上、macOS 或主流 Linux 发行版均可;内存 8GB 起步。磁盘要预留足量:Flutter SDK 本体约 3GB,Android SDK 约 7GB,再加 IDE,建议空余 15GB 以上。两个平台性约束先记住:iOS / macOS 目标必须用 macOS 加 Xcode,Windows 上没有替代;Windows 桌面目标需要安装 Visual Studio(带”使用 C++ 的桌面开发”工作负载),注意是 Visual Studio,不是 VS Code。

安装方式怎么选

方式 得到什么 适合 为什么另外的人不用它
VS Code Flutter 扩展安装 扩展自动下载 SDK、配 PATH、跑首次诊断 第一次接触 Flutter 依赖 VS Code,CI 与无图形环境用不了
手动下载 SDK 压缩包 解压即用的 SDK 目录,自己配 PATH CI、公司受限环境、不想用 VS Code 升级与多版本管理全手工
fvm(Flutter Version Management) 按项目锁定 SDK 版本,多版本并存 同时维护多个 Flutter 项目 多一层工具,单人单项目时是多余复杂度
git clone flutter 仓库 完整源码仓库,可直接切 channel 改代码 要给 Flutter 提交 PR 的人 体积大、更新慢,纯使用者没有任何收益

官方文档当前推荐路径是第一种:装好 VS Code 与 Flutter 扩展后,命令面板执行 Flutter: Install SDK,扩展代劳下载与 PATH。手动方式的步骤如下,以 macOS 与 Linux 为例:

# 解压到用户目录:不要放进 /Applications 或需要 sudo 的路径
cd ~/development
unzip ~/Downloads/flutter_linux_*.zip

1. 把 flutter/bin 加进 PATH(zsh 用户写 ~/.zshrc)
echo 'export PATH="$PATH:$HOME/development/flutter/bin"' >> ~/.bashrc
source ~/.bashrc

1. 验证:这里的 dart 版本应来自 flutter/bin 下的那份
flutter --version

Windows 用户解压到例如 C:devflutter,在”系统属性 → 环境变量”把 C:devflutterbin 追加进 Path,重开 PowerShell 后验证。无论哪种系统,判断标准只有一个:新开终端敲 flutter doctor 有输出。

国内镜像的正确姿势

Flutter 第一次运行会从 Google 服务器下载 Dart SDK 与引擎制品,pub get 会访问 pub.dev。大陆网络环境下这两步都会超时,解法是官方文档”在中国网络环境下使用 Flutter”给出的两个环境变量:

# macOS / Linux:写进 ~/.bashrc 或 ~/.zshrc 长期生效
export PUB_HOSTED_URL="https://pub.flutter-io.cn"
export FLUTTER_STORAGE_BASE_URL="https://storage.flutter-io.cn"
# Windows PowerShell(当前会话):
$env:PUB_HOSTED_URL="https://pub.flutter-io.cn"
$env:FLUTTER_STORAGE_BASE_URL="https://storage.flutter-io.cn"
1. 长期生效请用"系统环境变量"界面添加同名变量

三个容易踩的点。第一,顺序:变量必须在第一次运行 flutter 命令之前设好,因为下载 Dart SDK 就发生在首次执行时,卡在 “Downloading Dart SDK” 十有八九是变量设晚了或没生效,echo $PUB_HOSTED_URL 确认后再重试。第二,两个都要设:只设 PUB_HOSTED_URL 的话包下载快了,但引擎二进制与 SDK 更新仍走 Google 源。第三,变量名拼写:是 FLUTTER_STORAGE_BASE_URL,网上转抄的 FLUTTER_STORAGE_BASE_BASE、FLUTTER_STORAGE_URL 都是错的,拼错等于没设。该镜像由 Flutter 中文社区(CFUG)维护,若个别时段不可用,以 docs.flutter.cn 的公告为准,教育网另有备用镜像。

flutter doctor 逐项解读

flutter doctor -v 是体检报告,逐项说明:

检查项 看什么 不绿时怎么修
Flutter 当前版本与 channel(stable / beta) 开发用 flutter channel stable;版本旧就 flutter upgrade
Android toolchain Android SDK、命令行工具、许可证 见下方三条具体修法
Xcode 仅 macOS;iOS / macOS 目标需要 装 Xcode 并 sudo xcode-select --switch /Applications/Xcode.app;不做苹果目标可忽略
Chrome Web 目标的开发调试浏览器 装 Chrome 即可,其余浏览器不能替代开发目标
Android Studio / VS Code IDE 是否装了 Flutter 插件 缺插件只影响 IDE 体验,不影响命令行构建
Network resources 能否访问 Google 侧资源 国内环境设好上面两个镜像变量后重跑,此项仍可能报警,能正常 pub get 即可

Android toolchain 是新手卡得最多的一行,三种常见红法各有对应修法:cmdline-tools component is missing,打开 Android Studio 的 SDK Manager,在 SDK Tools 里勾选 Android SDK Command-line Tools 安装;license status unknown,执行 flutter doctor --android-licenses 逐项接受;另外较新版本的 cmdline-tools 会让 --android-licenses 以警告退出,属已知问题而非你装错了,以官方故障排除页的当前说法为准。还有一个前提容易被漏掉:Android SDK 本身随 Android Studio 安装,纯命令行用户至少也要装一次 Android Studio 来获得 SDK 与模拟器。

IDE:Android Studio 还是 VS Code

维度 Android Studio(IntelliJ 系 + Flutter 插件) VS Code(Flutter 扩展)
重量 重,启动与索引慢,但功能全 轻,秒开
强项 SDK Manager、AVD 模拟器管理、Profiler 集成 官方文档当前推荐的安装与上手路径
适合 重度安卓背景、需要常开性能分析 多数人日常写码

两者不互斥,常见组合是 VS Code 写码 + Android Studio 只当 SDK 与模拟器的管理面板用。编辑器里的 Flutter 插件/扩展提供了保存即热重载、Widget Inspector 入口、代码补全三大能力,命令行裸写代码等于放弃这一层,不建议。

版本管理:channel 与 fvm

官方仓库分 channel:stable 给应用开发,beta 预览下一个稳定版。官方节奏是一年四个稳定版:2024 年 2 月发布了 3.19(当前稳定版),预计 5 月的 3.22 接棒,之后下半年按季度再出两版,升级用 flutter upgrade。多项目并行时不同项目依赖不同 Flutter 版本,直接升级全局 SDK 会互相打架,这时用 fvm:

# fvm 仍在活跃维护,安装方式以 fvm.app 首页为准
fvm install stable        # 安装当前 stable
cd my_app
fvm use stable            # 项目目录生成版本标记,团队成员执行同样命令
fvm flutter doctor        # 之后用 fvm flutter 代替 flutter,保证走项目锁定的版本

团队统一的意义在于:Flutter 稳定版节奏较快且偶有破坏性变化(例如 Gradle 插件的旧式 apply 写法自 3.16 起废弃并开始报警、每版都会移除一批长期废弃的 API),每个项目钉住自己的版本,升级才是显式决定而不是被动接受。这个时点的现状也值得知道:material 与 cupertino 组件库仍内置在 SDK 中、没有迁往独立 pub 包,iOS 侧的原生依赖管理默认仍是 CocoaPods。CI 上要么用 fvm,要么直接下载固定版本的 SDK 压缩包,效果等价。另一个多版本工具 Puro 也在社区流行,选哪个看口味,关键是别让”每个人本机各一个版本”成为团队的默认状态。

Web 与桌面目标

Web、Windows、macOS、Linux 桌面均已进入 stable 且默认启用,flutter devices 能直接列出当前机器支持的设备。附加成本在系统依赖:Web 目标调试需要 Chrome;Windows 桌面目标需要 Visual Studio 的 C++ 工作负载(安装体积大,装之前确认真的要做桌面);Linux 桌面需要 clang、cmake、ninja 与一组 dev 库,缺什么 flutter doctor 会点名。跑起来的方式都是同一条命令换个设备号:

flutter devices              # 先看本机有哪些可用目标
flutter run -d chrome        # Web
flutter run -d windows       # Windows 桌面(仅 Windows 机器)
flutter build web            # 产出静态文件,可挂任意静态服务器

网上大量旧教程开头让你执行 flutter config --enable-windows-desktop 之类的开关命令,那是 Flutter 3.0 之前的流程,现在这些开关默认全开,照抄只会得到”该配置已废弃”的提示。

常见问题

Q1: 提示 flutter 不是内部或外部命令

PATH 没生效。确认变量加的是 SDK 目录下的 bin 子目录,然后重开终端——修改环境变量对已打开的终端不生效。

Q2: 首次运行卡在 Downloading Dart SDK

镜像变量没设或没生效。echo 两个变量确认非空,删掉 SDK 目录里的缓存后重跑;变量拼写错误是最常见原因。

Q3: doctor 里 Android 全红但从没装过 Android Studio

这不是报错,是还没装 Android 侧工具链。只想先学 Dart 语法与 Web 目标的话,可以先跑 flutter run -d chrome,Android 那行留着以后再补。

最佳实践与反模式

反模式一:把 SDK 解压到需要管理员权限的目录(如 C:Program Files)或含中文、空格的路径。前者每次升级都要提权,后者会在构建脚本里产生一堆转义问题。SDK 是绿色目录,放在 C:devflutter、~/development/flutter 这类位置即可。

反模式二:单独安装 Dart SDK 又安装 Flutter。Flutter 目录里自带配套版本的 Dart,两者版本是绑定发布的;另装一个全局 Dart 会让 dart 命令指向未知版本,排错时最浪费时间。让 PATH 里 flutter/bin 排在前面,dart 就用 Flutter 带的那份。

反模式三:把 doctor 的每一行红都当成必须消灭的敌人。doctor 是按”全平台开发”的口径检查的,按需对绿你要的目标平台即可。

检查清单

  • flutter –version 有输出,channel 为 stable
  • PUB_HOSTED_URL 与 FLUTTER_STORAGE_BASE_URL 已设且拼写正确
  • flutter doctor 中你目标平台对应的项为绿
  • IDE 装好 Flutter 插件/扩展,新建工程能看到代码补全
  • flutter devices 能列出至少一个可用设备
  • 多项目场景下 fvm use 已在项目里生效

下一步

这一篇的产出是一台能创建、能运行、能诊断的开发机。下一篇《第一个 Flutter 应用》在它上面写出待办清单,体会热重载与”一切皆 Widget”。写过 React Native 的读者可以对照站内《React Native 环境搭建》,两套工具链在”原生 SDK 依赖”这一点上高度相似,差别在 Flutter 把 Dart 与引擎一起打包、不依赖 Node;Web 背景的读者则可再看同结构的《Next.js 环境搭建与工具链》,对比”包管理器为中心”与”SDK 为中心”两种工具链设计。

版本核实(撰写时检索,2024-04-15):Flutter 当前稳定版为 3.19(2024-02 发布,配套 Dart 3.3),3.22 预计 2024-05 发布;2024 年官方节奏为四个稳定版(2 月 3.19、5 月 3.22,下半年按季度再发两版)。安装命令一律不钉版本号,具体版本以 docs.flutter.dev 与本机 flutter –version 为准;国内镜像变量以 docs.flutter.cn 公告为准;fvm 维护状态以 fvm.app 为准。

暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇