Flutter安装踩坑指南

前言

昨天安装flutter时，遇到了不少问题，特此开了这篇博文写一下踩坑经历，解决方法，顺便做一下归档
有些安装问题参考了很多文档，博客，因为过于零散，这里只给出部分出处
有些问题因为中国大陆的原因暂时无解，但不影响flutter的使用，具体请看下文
由于Flutter会同时构建Android和IOS两个平台的发布包，所以Flutter同时依赖Android SDK和iOS SDK，在安装Flutter时也需要安装相应平台的构建工具和SDK。因为本人暂时只用Windows环境进行开发，这里只涉及flutter在Windows下的环境搭建。

使用镜像

由于在国内访问Flutter有时可能会受到限制，Flutter官方为中国开发者搭建了临时镜像，大家可以将如下环境变量加入到用户环境变量中：

1 2	export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

一般来说，window系统是使用了不了export命令的（linux可以），当然你可以用setx 命令，不过这里我们直接手动添加就好了：
- 转到 “控制面板>用户帐户>用户帐户>更改我的环境变量”
- 在“用户变量”下新建用户变量，添加上面的变量名和变量值

此镜像为临时镜像，并不能保证一直可用，读者可以参考https://flutter.dev/community/china 以获得有关镜像服务器的最新动态。

安装git命令行工具

安装flutter前请先安装git命令行工具,不然是无法执行flutter的命令的，这里点击下方链接，选择版本安装就好了
Git for Windows
已安装Git for Windows后，请确保命令提示符或PowerShell中运行 git 命令，不然在后面运行flutter doctor时将出现Unable to find git in your PATH错误, 此时需要手动添加C:\Program Files\Git\bin至Path系统环境变量中。

这里是添加到系统环境变量的Path中而不是用户环境变量的Path中

获取Flutter SDK

版本

Flutter SDK有多个分支，如beta、dev、master、stable，其中stable分支为稳定分支（日后有新的稳定版本发布后可能也会有新的稳定分支，如1.0.0），dev和master为开发分支
这里我下载版本是文章创建时的最新稳定版本：

Flutter version	Architecture	Ref	Release Date	Dart version
2.10.5	x64	5464c5b	2022/4/19	2.16.2

下载

因为翻墙问题,这里给出多个，下载地址：
- Flutter 官方网站：https://flutter.dev/docs/development/tools/sdk/releases
- 清华大学镜像：https://mirrors.tuna.tsinghua.edu.cn/flutter/flutter_infra_release/releases/stable/windows/
- flutter github:https://github.com/flutter/flutter/releases
将安装包zip解压到你想安装Flutter SDK的路径（如：C:\src\flutter；注意，不要将flutter安装到需要一些高权限的路径如C:\Program Files\）。
在Flutter安装目录的flutter文件下找到flutter_console.bat，双击运行并启动flutter命令行，接下来，你就可以在Flutter命令行运行flutter命令了。

更新环境变量

如果你想在Windows系统自带命令行运行flutter命令，需要添加以下环境变量到用户PATH：

转到 “控制面板>用户帐户>用户帐户>更改我的环境变量”
在“用户变量”下检查是否有名为“Path”的条目:
- 如果该条目存在，追加 flutter\bin的全路径，使用 ; 作为分隔符.
- 如果该条目不存在，创建一个新用户变量 Path ，然后将 flutter\bin 的全路径作为它的值.

重启Windows以应用此更改.

检测Flutter运行依赖（踩坑重点）

执行flutter doctor命令

打开一个新的命令提示符或PowerShell窗口并运行以下命令以查看是否需要安装任何依赖项来完成安装：：

1	flutter doctor

第一次运行flutter doctor时间可能比较久，这里我第一次运行后的结果，可以看出，flutter doctor运行后给出问题的同时，也给出了解决方案，但鉴于国内某种神秘力量导致的网络原因，可能用给出的方法无法解决（是我），所以下面给出几个问题官方方案外的解决办法。

常见问题及解决方案

[!] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at D:\Android\sdk
    X cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    X Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/windows#android-setup for more details.

Android toolchain 是 Android 开发工具链，包含用于开发运行于 Android设备 的程序必需的一些程序或配置项。检查的结果显示这里有两个问题：

问题一

X cmdline-tools component is missing这个是插件Android SDK Command-line Tools(latest)没有安装，如果命令行path/to/sdkmanager --install "cmdline-tools;latest"'无法安装，我们可以用android studio来安装这个插件

问题二

X Android license status unknown.这个问题的原因是 Flutter SDK 没有得到 Android SDK 的授权，解决的办法已经包含在问题的提示信息中。在命令窗口中输入命令： flutter doctor --android-licenses ，并全部回答 y，就可以了。

这里必须要先解决问题一中的插件问题

[!] HTTP Host Availability
    X HTTP host https://maven.google.com/ is not reachable. Reason: An error occurred while checking the HTTP host:
      信号灯超时时间已到
 	X HTTP host https://maven.google.com/ is not reachable. Reason: An error occurred while checking the HTTP host:
      信号灯超时时间已到

这个问题是因为国内网络问题（某种神秘力量），谷歌maven我们可以尝试更换更好阿里云的镜像来解决，但是谷歌云还是暂时无法解决。因为不影响flutter使用，个人建议不理就好了，所以下面谷歌maven更换镜像是可选操作

谷歌maven更换镜像（可选）
- 打开/path-to-flutter-sdk/packages/flutter_tools/lib/src/http_host_validator.dart文件，修改https://maven.google.com/为 google maven 的国内镜像，如https://maven.aliyun.com/repository/google/
- 删除/path-to-flutter-sdk/bin/cache 文件夹
- 重新执行flutter doctor

这里path-to-flutter-sdk是你自己的flutter的文件路径；
删除cache文件后，运行flutter doctor会重新下载cache文件(近800m)，网络不好的话过程及其缓慢
当然实际上你只要删除cache一个或多个相关文件就好了，然后运行flutter doctor重新下载这些文件，但我也不知道具体是哪些文件，就粗暴删除整个cache文件夹了

[X] Visual Studio - develop for Windows
[X] Chrome - develop for the web (Cannot find Chrome executable at .\Google\Chrome\Application\chrome.exe)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[X] Android Studio

[X] Chrome - develop for the web 表示找不到 Chrome 浏览器, 这一项可以忽略，开发 Flutter web 应用时，可以直接使用 Windows 10 自带的 Edge (web) 浏览器
[X] Visual Studio - develop for Windows表示你没有安装Visual Studio，因为我是轮替使用visual studio和android studio，如果你没有特别需求可以不安装
[x] Android Studio没有安装android这个idea，这里给你个链接Download Android Studio and SDK tools | Android Developers (google.cn)

IDE配置与使用（踩坑重点）

理论上可以使用任何文本编辑器与命令行工具来构建Flutter应用程序。不过，Flutter官方建议使用Android Studio和VS Code之一以获得更好的开发体验。Flutter官方提供了这两款编辑器插件，通过IDE和插件可获得代码补全、语法高亮、widget编辑辅助、运行和调试支持等功能，可以帮助我们极大的提高开发效率。下面我们分别介绍一下Android Studio和VS Code的配置及使用.

简介

由于Android Studio是基于IntelliJ IDEA开发的，所以读者也可以使用IntelliJ IDEA。

安装Flutter和Dart插件

需要安装两个插件:

Flutter插件：支持Flutter开发工作流 (运行、调试、热重载等)。
Dart插件：提供代码分析 (输入代码时进行验证、代码补全等)。

安装步骤

启动Android Studio。
打开插件首选项 (macOS：Preferences>Plugins, Windows：File>Settings>Plugins)。
选择 Browse repositories…，选择 flutter 插件并点击 install。
重启Android Studio后插件生效。

创建Flutter应用

选择 File>New Flutter Project 。
选择 Flutter application 作为 project 类型, 然后点击 Next。
输入项目名称 (如 myapp)，然后点击 Next。
点击 Finish。
等待Android Studio安装SDK并创建项目。

上述命令创建一个Flutter项目，项目名为myapp，其中包含一个使用Material 组件 (opens new window)的简单演示应用程序。

在项目目录中，您应用程序的代码位于 lib/main.dart。

运行应用程序

定位到Android Studio工具栏，如图所示：
在 target selector 中, 选择一个运行该应用的Android设备。如果没有列出可用，请选择 Tools>Android>AVD Manager 并在那里创建一个。
在工具栏中点击 Run图标。
如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序，如图所示：

图1-4

然而因为某种东方力量（墙），我们第一次运行后是卡在gradle，并不能成功运行应用，具体问题如下

踩坑

问题分析

因为国内网络原因，我第一次run就永久卡在Running Gradle task ‘assembleDebug‘ . . .,这时候我们可以用我们的老朋友阿里云镜像来解决这个问题

具体步骤：

修改android\build.gradle文件，把获取方法，换成通过镜像获取

1
2
3

maven { url 'https://maven.aliyun.com/repository/google' }
      maven { url 'https://maven.aliyun.com/repository/jcenter' }
      maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }

修改Flutter的配置文件, 该文件在Flutter安装目录/packages/flutter_tools/gradle/flutter.gradlej

1
2
3

maven { url 'https://maven.aliyun.com/repository/google' }
         maven { url 'https://maven.aliyun.com/repository/jcenter' }
         maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }

之后再次运行，各种文件下载完成后，不出意外的话，你就可以看到示例app了

体验热重载

Flutter 可以通过 热重载（hot reload） 实现快速的开发周期，热重载就是无需重启应用程序就能实时加载修改后的代码，并且不会丢失状态。简单的对代码进行更改，然后告诉IDE或命令行工具你需要重新加载（点击reload按钮），你就会在你的设备或模拟器上看到更改。

打开lib/main.dart文件
将字符串 'You have pushed the button this many times:' 更改为 'You have clicked the button this many times:'
不要按“停止”按钮; 让您的应用继续运行.
要查更改，请调用 Save (cmd-s / ctrl-s)，或者点击 热重载按钮 (带有闪电⚡️图标的按钮)。

你会立即在运行的应用程序中看到更新的字符串。

简介

VS Code是一个轻量级编辑器，支持Flutter运行和调试。

安装flutter插件安装flutter插件

启动 VS Code。
调用 View>Command Palette…。
输入 ‘install’, 然后选择 Extensions: Install Extension action。
在搜索框输入 flutter ，在搜索结果列表中选择 ‘Flutter’, 然后点击 Install。
选择 ‘OK’ 重新启动 VS Code。
验证配置
- 调用 View>Command Palette…
- 输入 ‘doctor’, 然后选择 ‘Flutter: Run Flutter Doctor’ action。
- 查看“OUTPUT”窗口中的输出是否有问题

创建Flutter应用

启动 VS Code
调用 View>Command Palette…
输入 ‘flutter’, 然后选择 ‘Flutter: New Project’ action
输入 Project 名称 (如myapp), 然后按回车键
指定放置项目的位置，然后按蓝色的确定按钮
等待项目创建继续，并显示main.dart文件

体验热重载

打开lib/main.dart文件。
将字符串 'You have pushed the button this many times:' 更改为 'You have clicked the button this many times:'。
不要按“停止”按钮; 让您的应用继续运行。
要查看您的更改，请调用 Save (cmd-s / ctrl-s), 或者点击 热重载按钮 (绿色圆形箭头按钮)。

你会立即在运行的应用程序中看到更新的字符串。

版本控制

Flutter SDK分支

Flutter SDK有多个分支，如beta、dev、master、stable，其中stable分支为稳定分支（日后有新的稳定版本发布后可能也会有新的稳定分支，如1.0.0），dev和master为开发分支，安装flutter后，你可以运行flutter channel查看所有分支，如笔者本地运行后，结果如下：

Flutter channels:
  beta
  dev
* master

即你本地的Flutter SDK 跟踪的分支，要切换分支，可以使用flutter channel beta 或 flutter channel master，Flutter官方建议跟踪稳定分支，但你也可以跟踪master分支，这样可以查看最新的变化，但这样稳定性要低的多。

#升级Flutter SDK和依赖包

要升级flutter sdk，只需一句命令：

1	flutter upgrade

该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包（不包括Flutter SDK），可以使用如下命令：

flutter packages get获取项目所有的依赖包。
flutter packages upgrade 获取项目所有依赖包的最新版本。

日后谈

第一次安装flutter，我想不到会有这么多的小问题，当然其实大部分是由于国内网络（神秘东方力量和中国大陆不存的谷歌公司）的原因，这里其实很多人想到用vpn是不是就能解决这个问题呢？
答案是对但也不完全对，因为除了部分下载软件插件的时候可以通过vpn加速外，软件内部的资源获取和数据连接，是及时你设置全局代理也无法连接上的
这里给出一个我自己常用的vpn付费服务，如果大家想用来加速一下github登陆，看看直播，网飞之类的是可以的。但是游戏加速器的话，个人觉得是不可行的。当然最有价值的，我个人觉得是github加速和git文件传输加速了

请不要随意传播

https://client.cloudn.me/aff.php?aff=18067

幸好中国还是有很多像清华镜像，阿里镜像这种资源镜像网站，对于我们日常开发来说，不会有太大的问题
不过像内置的谷歌云这种服务的话，我们就当它不存在好了