Flutter入门：在Windows上搭建Flutter开发环境

最新推荐文章于 2024-08-26 22:58:26 发布

不二程序员

最新推荐文章于 2024-08-26 22:58:26 发布

阅读量752

点赞数 2

分类专栏： Flutter 文章标签： Flutter flutter环境配置

本文链接：https://blog.csdn.net/Cyx77520/article/details/97273998

版权

Flutter 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

使用镜像

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

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

必要的工具

工具: Flutter 依赖下面这些命令行工具.

Git for Windows (Git命令行工具)

如果已安装Git for Windows，请确保命令提示符或PowerShell中运行 git 命令，不然在后面运行flutter doctor时将出现Unable to find git in your PATH错误, 此时需要手动添加C:\Program Files\Git\bin至Path系统环境变量中。

注意：此处的git路径仅为示例，实际应为你的git安装的具体路径

获取Flutter SDK

去flutter官网下载其最新可用的安装包，点击下载；

注意：Flutter的渠道版本会不停变动，请以Flutter官网为准。另外，在中国大陆地区，要想正常获取安装包列表或下载安装包，可能需要翻墙，读者也可以去Flutter github项目下去下载安装包。不过我的建议是直接通过git进行clone，如下：git clone -b stable https://github.com/flutter/flutter.git

将安装包zip解压到你想安装Flutter SDK的路径（如：C:\src\flutter；注意，不要将flutter安装到需要一些高权限的路径如C:\Program Files\）。
在Flutter安装目录的flutter文件下找到flutter_console.bat，双击运行并启动flutter命令行，接下来，你就可以在Flutter命令行运行flutter命令了。

注意：由于一些flutter命令需要联网获取数据，如果您是在国内访问，由于众所周知的原因，直接访问很可能不会成功。上面的PUB_HOSTED_URL和FLUTTER_STORAGE_BASE_URL是google为国内开发者搭建的临时镜像。

更新环境变量

要在终端运行 flutter 命令，你需要添加以下环境变量到系统PATH：

转到 “控制面板>系统安全>系统>高级系统设置>环境变量”
在“系统变量”下检查是否有名为“Path”的条目:

如果该条目存在, 追加 flutter\bin的全路径，使用 ; 作为分隔符.
如果条目不存在, 创建一个新系统变量 Path ，然后将 flutter\bin的全路径作为它的值.

在“系统变量”下检查是否有名为”PUB_HOSTED_URL”和”FLUTTER_STORAGE_BASE_URL”的条目，如果没有，也添加它们。（即配置使用镜像步骤中的键值对）
重启Windows以应用此更改

运行 flutter doctor

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

flutter doctor

在命令提示符或PowerShell窗口中运行此命令。目前，Flutter不支持像Git Bash这样的第三方shell。
该命令检查您的环境并在终端窗口中显示报告。Dart SDK已经在捆绑在Flutter里了，没有必要单独安装Dart。仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务（以粗体显示）
例如:

[-] Android toolchain - develop for Android devices
    • Android SDK at D:\Android\sdk
    ✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
    • Try re-installing or updating your Android SDK,
      visit https://flutter.io/setup/#android-setup for detailed instructions.

第一次运行一个flutter命令（如flutter doctor）时，它会下载它自己的依赖项并自行编译。以后再运行就会快得多。

以下各部分介绍如何执行这些任务并完成设置过程。你会看到在flutter doctor输出中，如果你选择使用IDE，我们提供了，IntelliJ IDEA，Android Studio和VS Code的插件，请参阅编辑器设置以了解安装Flutter和Dart插件的步骤。

一旦你安装了任何缺失的依赖，再次运行flutter doctor命令来验证你是否已经正确地设置了。

编辑器设置

使用 flutter 命令行工具，您可以使用任何编辑器来开发Flutter应用程序。输入flutter help在提示符下查看可用的工具。

Android Studio设置

安装Flutter和Dart两个插件

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

启动Android Studio.
打开插件首选项 (Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux).
选择 Browse repositories…, 选择 Flutter 插件并点击 install.
重启Android Studio后插件生效.

创建Flutter应用

选择 File>New Flutter Project
选择 Flutter application 作为 project 类型, 然后点击 Next
输入项目名称 (如 myapp), 然后点击 Next
点击 Finish
等待Android Studio安装SDK并创建项目.
上述命令创建一个Flutter项目，项目名为myapp，其中包含一个使用Material 组件的简单演示应用程序。
在项目目录中，您应用程序的代码位于 lib/main.dart.

运行Flutter应用程序

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