环境搭建

操作系统选择

很多同学会问，学习 Flutter 到底使用什么操作系统呢？

学习阶段： Windows 或者 macOS（苹果操作系统）都是可以的

开发阶段： 一般需要使用 macOS，因为我们需要针对 iOS 进行调试，通常方便起见还是选择 macOS

疑问： 如果以后做 Flutter 开发没有 macOS 怎么办？

这个可以完全放心，使用 Flutter 开发的公司必然会给你配备 macOS 的

Flutter 可以在 Windows 上学习，也可以在 macOS 上，因为我之后的课程要进行 Android 和 iOS 的调试，所以我当前使用的环境是 macOS 的。

这里我再次强调，学习阶段使用 Windows 是没有任何问题，我之前也在 Windows 上写过很多 Flutter 的东西！

在安装的过程中，我也会说到很多 Windows 安装的注意事项，大家按照步骤一步步完成即可。

安装 Flutter SDK

使用 Flutter 开发，首先我们需要安装一个 Flutter 的 SDK。

下载 Flutter 的 SDK

来到 Flutter 的官网网站，选择最新稳定的 Flutter SDK 的版本

网站地址：https://flutter.dev/docs/development/tools/sdk/releases?tab=macos

选择自己的操作系统和最新稳定的版本（Stable 版本）（我当前最新稳定的版本是 1.7.8）

安装 Flutter

1. 解压下载好的 Flutter SDK

这个在 Windows 和 macOS 都是一样的（选择一个自己想要安装的目录）

但是在 macOS 中，我通常会讲 flutter 目录拖入到应用程序中，将其当作我的一个应用（个人习惯而已）

2. 配置 Flutter 的环境变量 因为我们之后需要在命令行执行 Flutter 的命令，所以需要配置环境变量

macOS 或者 Linux 系统，需要编辑~/.bash_profile 文件

export PATH=$PATH:/Applications/flutter/bin

Windows 用户将所在路径添加到环境变量的 Path 下

• Windows 环境变量修改：点击计算机图标 - 属性 - 高级系统设置 - 高级 - 环境变量
• 找到 Path，在其中添加 Flutter SDK 目录下 bin 目录

在终端中执行 flutter --version，出现如下内容，说明安装 flutter 成功

配置镜像

flutter 项目会依赖一些东西，在国内下载这些依赖会有一些慢，所以我们可以将它们的安装源换成国内的（也就是设置国内的镜像）

macOS 或者 Linux 操作系统，依然是编辑~/.bash_profile 文件

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

Windows 用户还是需要修改环境变量

• Windows 环境变量修改：点击计算机图标 - 属性 - 高级系统设置 - 高级 - 环境变量
• 新建 变量 PUB_HOSTED_URL，其值为https://pub.flutter-io.cn
• 新建 变量 FLUTTER_STORAGE_BASE_URL， 其值为https://storage.flutter-io.cn

注意： 此镜像为临时镜像，并不能保证一直可用，大家可以参考详情请参考 Using Flutter in China[1] 以获得有关镜像服务器的最新动态。

配置 iOS 环境

如果想为 Flutter 配置 iOS 开发环境，需要在我们的电脑上安装一个 Xcode（此部分 Windows 电脑忽略）

• Xcode 是苹果公司的 iOS 和 macOS 的 IDE，进行过 iOS 开发的童鞋应该都非常熟悉

如何安装 Xcode 呢？ 常见的是两种

1. 直接在 App Store 上搜索 Xcode，找到安装即可

• 这种安装方式有一个缺点，安装的一定是最新版本的（当然是用最新版本的最好）
• 但是最新版本的 Xcode 会对 macOS 系统有一定的要求，所以可能还要设计到系统升级
• 如果不希望系统升级，可以选择第二种方式

2. 第二种方式是安装自己想要的 Xcode 的版本，需要手动去下载

• 进入https://developer.apple.com/download/more[2]页面
• 登录自己的 Apple ID
• 在搜索框输入 Xcode，回车搜索，找到各种版本 Xcode 下载即可

打开安装好的 Xcode，可能打开速度有点慢：不着急，慢慢来 选择自己想用的 iOS 模拟器

打开 Xcode，右上角点击 Xcode - Open Developer Tools - Simulator 这个时候会打开一个默认的 iOS 模拟器，也可以在 Hardware - Device - 系统版本中选择自己想要测试的模拟器

这个时候，我们就能看到如下模拟器了

这个时候我们执行一下如下终端命令：

flutter doctor

看到如下有一个

配置 Android 环境

如果想为 Flutter 配置 Android 开发环境，需要在我们的电脑上安装一个 Android Studio

• Android Studio 是基于 IntelliJ IDEA 的、Google 官方的 Android 应用集成开发环境 (IDE)。

Android Studio 的下载

• 官网地址：https://developer.android.com/studio/?utm_source=android-studio
• 直接在官方下载即可
• 安装直接双击安装即可

Android 的环境配置

• 打开 Android Studio，会问我们是否要设置代理，这是因为下载 Android SDK 等在国内不好下载
• 至于如何设置代理，这里就不再讲解了~~~
• 最好要设置代理哦，不然估计会被气死~~~

之后各种下一步，就会帮我们安装 SDK 等相关需要使用的内容 安装好后，点击 Finish 即可。

创建 Android 模拟器

安装好后，我们就可以去创建模拟器：选择 Configure - AVD Manger

选择 create virtual device

选择一个你想用的设备

选择 Android 的版本（这里我没有选择 Q 版本，它目前还是一个 bata 版本），点击 download

• 下一个界面，点击 accept - next 就可以了

接着下一步，给自己的模拟器起个名字

启动 Android 模拟器

这个时候我们执行一下如下终端命令：

flutter doctor

看到如下有两个可用的设备

开发工具的选择

官方推荐两个工具来开发 Flutter：Android Studio 和 VSCode，我们选择哪一个呢？

对于有选择恐惧症的人，还真不是特别好选择，所以下面我会分别说出它们的优缺点，选择权在你

最后我也会给出我的选择

VSCode 优缺点

VSCode 是最近非常非常流行的开发工具，并且非常好用！（我之前在微博感慨微软的东西最近两年越来越好用，其中之一就是 VSCode）

而且 VSCode 最近已经有取代 WebStorm 作为前端首选开发工具的趋势了

VSCode 的优点：

VSCode 其实并不能称之为是一个 IDE，它只是一个编辑器而已。

• 所以它非常的轻量级，不会占用你非常大的内存消耗，而且启动速度等都非常快，对于电脑配置不是特别高的同学，肯定是一个非常好的选择。
• 并且你可以在 VSCode 上安装各种各样的插件来满足自己的开发需求。

VSCode 的缺点：

• 很多 Android Studio 包括的方便操作没有，比如点击启动、热更新点击等；
• 而且在某些情况下会出现一些问题；
• 比如之前我在使用的过程中，有时候热更新不及时常常看不到效果，必须重启；
• 比如某些情况下，没有代码提示不够灵敏；

使用须知：

使用 VSCode 开发 Flutter 我们需要安装两个插件：Flutter 和 Dart

Android Studio 优缺点

对于进行过 Android 开发或者使用过 Webstorm、IDEA、PHPStorm 等的同学，使用 Android Studio 肯定是没有任何问题的

Android Studio 的优点：

• 集成开发环境（IDE）不用多说，你需要的功能基本都有
• 而且上面说的 VSCode 存在的问题，在 Android Studio 中基本不会出现

Android Studio 的缺点：

• 一个字：重
• 无论是 IDE 本身，还是使用 Android Studio 启动项目，都会相对慢一些
• 占据的计算机资源也很多，所以电脑配置较低是会出现卡顿

使用须知：

使用 Android Studio 开发 Flutter 我们需要安装两个插件：Flutter 和 Dart

我的选择

• 其实在两个之间到底如何选择对于童鞋们学习 Flutter 更好，我也是纠结了很久。
• 在我之前使用 Flutter 的过程中（写这个教程之前），我使用的都是 VSCode。
• 但是对于初学者来说，学习 Flutter 的过程中，Android Studio 会更加友好。
• 如果之后出视频教程，我可以设立一个投票，让大家决定使用的开发工具。
• 不过，无论使用哪个工具，都只是辅助而已，重要的还是我们课程的内容。

那么，我是如何选择 开发工具 呢？

• 在学习 Dart 语言过程中，我选择 VSCode，因为它可以直接创建一个 dart 文件让我们进行学习
• 在学习 Flutter 过程中，我选择 Android Studio，因为各种集成使用起来更加方便（你继续使用 VSCode 没有任何问题）