4、开发环境搭建:安装Flutter SDK、配置Android Studio、创建第一个Flutter项目
说实话,每次带新人入行,我最怕的就是环境搭建这一步。明明代码逻辑都懂,结果卡在装软件上,一卡就是半天。我自己当年也踩过不少坑,所以这一章咱们稳扎稳打,把环境彻底搞定。
你想想看,Flutter开发说白了就是三件事:装SDK、配IDE、跑项目。咱们一个一个来。
4.1 安装Flutter SDK
Flutter SDK是整套工具链的核心。没有它,你连flutter命令都敲不了。
第一步:下载SDK
去Flutter官网下载对应你操作系统的SDK压缩包。我个人习惯用Windows,所以下面以Windows为例。Mac和Linux流程类似,只是解压路径不同。
重要提醒:SDK不要放在C盘Program Files这种带空格的路径下。我见过有人放桌面,结果编译报错找半天原因。建议放D:\flutter或C:\src\flutter这种纯英文路径。
第二步:解压并配置环境变量
解压后,把flutter\bin目录加到系统环境变量的Path里。怎么加?
- 右键「此电脑」→「属性」→「高级系统设置」→「环境变量」
- 在「系统变量」里找到Path,双击编辑
- 新建一行,填入你的flutter\bin路径,比如D:\flutter\bin
- 确定保存,重启命令行窗口
验证是否成功:打开cmd,输入flutter --version。如果看到版本号,说明SDK装好了。
小技巧:配置完环境变量后,记得重启一下命令行。我刚开始学的时候,每次改完环境变量都不重启,然后跑来跑去问为什么没生效……
4.2 配置Android Studio
Flutter项目最终要跑在Android或iOS设备上。Android Studio就是咱们的「大本营」。
第一步:安装Android Studio
去官网下载最新版,安装时记得勾选「Android Virtual Device」组件。这个后面跑模拟器要用。
第二步:安装Flutter和Dart插件
打开Android Studio,依次点击:
- File → Settings → Plugins
- 在Marketplace里搜索「Flutter」,点击安装
- 它会提示你同时安装Dart插件,同意即可
- 重启Android Studio
注意:插件安装完成后,一定要重启IDE。我遇到过有人装完插件直接点「New Project」,结果找不到Flutter选项,急得满头大汗。重启一下就好了。
第三步:配置Android SDK路径
Flutter需要知道你的Android SDK装在哪。运行命令:
flutter doctor
这个命令会检查所有依赖项。如果提示「Android SDK not found」,你需要手动指定路径:
flutter config --android-sdk C:\Users\你的用户名\AppData\Local\Android\Sdk
嗯,这里要注意:每个人的SDK路径可能不一样。你可以在Android Studio的File → Settings → Appearance & Behavior → System Settings → Android SDK里看到具体路径。
4.3 创建第一个Flutter项目
环境配好了,咱们来写个「Hello World」吧。虽然老套,但这是检验环境是否OK的唯一标准。
方法一:命令行创建
打开cmd,进入你想放项目的目录,比如D:\projects:
flutter create hello_flutter
cd hello_flutter
flutter run
等它编译完,模拟器或真机上就会出现一个默认的Flutter应用——一个带加号按钮的计数器。
方法二:Android Studio创建
File → New → New Flutter Project → Flutter Application。填好项目名和路径,点Finish。IDE会自动帮你创建并运行。
我个人建议:刚开始用命令行创建,能让你更清楚每一步发生了什么。IDE虽然方便,但容易让你变成「只会点按钮」的开发者。
4.4 验证环境:flutter doctor
这个命令我几乎每天都会用。它就像体检报告,告诉你哪里有问题。
运行flutter doctor后,你会看到类似这样的输出:
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.0, on Windows 10)
[✓] Android toolchain - develop for Android devices
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.3)
[✓] VS Code (version 1.84)
[✓] Connected device (1 available)
每个项目前面有✓表示正常,✗表示有问题。我曾经遇到过一次「Android license status unknown」的报错,跑一下flutter doctor --android-licenses就解决了。
4.5 知识体系总览
下面这张图帮你理清本章的核心逻辑。说白了就是:SDK是引擎,IDE是方向盘,项目是你造的车。
4.6 常见问题与避坑
我整理了几个新手最容易碰到的问题,你看看有没有中招的:
| 问题 | 原因 | 解决方法 |
|---|---|---|
| flutter命令找不到 | 环境变量没配好 | 检查Path里是否有flutter\bin路径 |
| Android SDK找不到 | SDK路径未配置或配置错误 | 运行flutter config --android-sdk 指定路径 |
| 模拟器启动失败 | HAXM未安装或BIOS虚拟化未开启 | 安装Intel HAXM,重启进BIOS开启VT-x |
| 插件安装后不显示 | 未重启IDE | 重启Android Studio |
我的经验:曾经有一次我配完环境,flutter doctor全部打勾,但就是跑不起来。折腾了两小时,最后发现是Windows防火墙把adb端口封了。关掉防火墙就好了。所以如果所有检查都通过但运行失败,可以看看是不是安全软件在捣乱。
好了,环境搭建就到这里。你跟着走一遍,应该半小时内能搞定。如果卡住了,回头看看上面的步骤,大概率是环境变量或路径的问题。