在Windows平台上搭建Flutter环境,flutter doctor报错等解决方案
极速构建漂亮的原生应用
Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。
Flutter中文官方文档:https://flutterchina.club
一、下载安装Flutter SDK
1、下载地址:https://flutter.dev/docs/development/tools/sdk/releases
如果实在下载不了的话,点这里:https://pan.baidu.com/s/1fqaSqL8s_NWnb7L5YBEoVA,提取码:bhgc
2、将下载好的安装包flutter_windows_1.22.2-stable.zip解压到你想安装Flutter SDK的目录路径(如:C:\Users\MuGuiLin\AppData\Local\Flutter 或者 C:\src\flutter 等目录, 注意不要将flutter安装到需要一些高权限的路径,如C:\Program Files\ 或 D:\Program Files (x86)\等)。
3、配置镜像环境变量
由于在国内访问Flutter有时可能会受到限制,Flutter官方为中国开发者搭建了临时镜像,大家可以将如下环境变量加入到用户环境变量中:
变量名;PUB_HOSTED_URL 值:https://pub.flutter-io.cn
变量名;FLUTTER_STORAGE_BASE_URL 值:https://storage.flutter-io.cn
// 注意: 此镜像为临时镜像,并不能保证一直可用,读者可以参考详情请参考 Using Flutter in China 以获得有关镜像服务器的最新动态。
具体要配置方法如下:
2、配置 Path 环境变量:
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 系统变量 -> 找到Path -> 编辑 -> 新建
3、检查安装:环境变量设置完成后,重启一下电脑,然后在命令行工具中输入如下命令!
flutter doctor // 显示相关信息,就表示JDK安装配置成功
注:如果没有正确配置, 在运行flutter doctor时可能会报: where'不是内部或外部命令,也不是可运行的程序,或批处理文件。error:unable to find git in your path.等错误。
第一次运行flutter命令(如flutter doctor)时,它会下载它自己的依赖项并自行编译。以后再运行就会快得多。
以下各部分介绍如何执行这些任务并完成设置过程。你会看到在flutter doctor
输出中, 如果你选择使用IDE,我们提供了,IntelliJ IDEA,Android Studio和VS Code的插件, 请参阅编辑器设置 以了解安装Flutter和Dart插件的步骤。
一旦你安装了任何缺失的依赖,再次运行flutter doctor
命令来验证你是否已经正确地设置了。
效果如下:
二、安装 Android Studio
您可以使用任何编辑器来开发Flutter应用程序。输入flutter help
在提示符下查看可用的工具。
但官方建议使用我们的插件来获得丰富的IDE体验,支持编辑,运行和调试Flutter应用程序。请参阅编辑器设置了解详细步骤
1、安装 Android Studio下载地址:https://developer.android.com/studio,下载完成后,点击安装 -> "Next"来安装选中的组件。
如果实在下载不了的话,点这里:https://pan.baidu.com/s/1OxHxpbH1Xi-VLP-gfTtb2A,提取码:3knc
2、安装 Android SDK:
Android Studio 默认会安装最新版本的 Android SDK。目前编译 React Native 应用需要的是Android 11 (Q)版本的 SDK(注意 SDK 版本不等于终端系统版本,RN 目前支持 android4.1 以上设备)。你可以在 Android Studio 的 SDK Manager 中选择安装各版本的 SDK。
你可以在 Android Studio 的欢迎界面中找到 SDK Manager。点击"Configure",然后就能看到"SDK Manager"。
在 SDK Manager 中选择"SDK Platforms"选项卡,然后在右下角勾选"Show Package Details"。展开Android 11 (Q)选项,确保勾选了下面这些组件(重申你必须使用稳定的*工具,否则可能都看不到这个界面):
- Android SDK Platform 30
- Intel x86 Atom_64 System Image(官方模拟器镜像文件,使用非官方模拟器不需要安装此组件)
然后点击"SDK Tools"选项卡,同样勾中右下角的"Show Package Details"。展开"Android SDK Build-Tools"选项,确保选中了 React Native 所必须的30.0版本。你可以同时安装多个其他版本。
最后点击"Apply"来下载和安装这些组件。
3、配置 ANDROID_HOME 和 Path 环境变量:
React Native 需要通过环境变量来了解你的 Android SDK 装在什么路径,从而正常进行编译。
你可以在 Android Studio 的"Preferences"菜单中查看 SDK 的真实路径,具体是Appearance & Behavior → System Settings → Android SDK。
打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 高级 -> 环境变量 -> 系统变量 -> 新建,创建一个名为ANDROID_HOME的环境变量(系统或用户变量均可),指向你的 Android SDK 所在的目录(具体的路径可能和下图不一致,请自行确认):
注:在Window10系统中 SDK的默认存放路径是在下面的这个目录:
C:\Users\你的用户名\AppData\Local\Android\Sdk
注:你需要关闭现有的命令符提示窗口 或 重启一下电脑,然后重新打开命令行工具,这样新的环境变量才能生效。
三、设置Android模拟器
要准备在Android模拟器上运行并测试您的Flutter应用,请按照以下步骤操作:
- 在您的机器上启用 VM acceleration .
- 启动 Android Studio>Tools>Android>AVD Manager 并选择 Create Virtual Device.
- 选择一个设备并选择 Next。
- 为要模拟的Android版本选择一个或多个系统映像,然后选择 Next. 建议使用 x86 或 x86_64 image .
- 在 Emulated Performance下, 选择 Hardware - GLES 2.0 以启用 硬件加速.
-
验证AVD配置是否正确,然后选择 Finish。
有关上述步骤的详细信息,请参阅 Managing AVDs.
- 在 Android Virtual Device Manager中, 点击工具栏的 Run。模拟器启动并显示所选操作系统版本或设备的启动画面.
- 运行
flutter run
启动您的设备. 连接的设备名是Android SDK built for <platform>
,其中 platform 是芯片系列, 如 x86.