搭建开发环境

本章会着重介绍一下Mac和Windows环境下Flutter开发环境的搭建，以及IDE插件的配置

1.1.1 配置镜像

国内用户访问Flutter可能会受限制，为此Flutter官网提供了临时镜像供国内用户使用，需要在环境变量中添加以下配置

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

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

注意:这两个镜像都是临时镜像，不能保证其稳定性，可以参考 https://flutter.io/community/china

1.1.2 MacOS下配置Flutter

下载FlutterSDK

1. 官网下载，官网下载地址 https://flutter.io/sdk-archive/#macos
2. github下载，github下载地址 https://github.com/flutter/flutter/releases
3. 解压SDK，使用unzip命令解压下载好的SDK文件,比如:

cd ~/xxx
unzip ~/xxx/xxx/xxx.zip

更新环境变量

打开.bash_profile文件，将Flutter的环境变量按如下格式添加到PATH中:

export PATH=[FLUTTER_INSTALL_PATH]/flutter/bin:$PATH

FLUTTER_INSTALL_PATH表示FlutterSDK的解压目录路径，比如/Users/admin/Flutter/

验证flutter是否已经添加到PATH中

echo $PATH

运行flutter doctor命令

flutter doctor命令可以帮助我们检查flutter的配置过程中的依赖项有哪些已经添加，哪些还没有添加，我们可以根据提示安装缺失的依赖项。比如:

[!] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[✗] Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS development.
      Download at: https://developer.apple.com/xcode/download/
      Or install Xcode via the App Store.
      Once installed, run:
        sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
        sudo xcodebuild -runFirstLaunch

1.1.3 Windows下配置Flutter

下载FlutterSDK

1. 官网下载，官网下载地址 https://flutter.dev/docs/development/tools/sdk/releases
2. github下载，github地址 https://github.com/flutter/flutter/releases

下载完成之后把压缩包解压到指定目录，然后执行flutter文件夹下的flutter_console.bat批处理文件，在弹出的命令行窗口中就可以执行flutter明令了。

更新环境变量

将flutter安装目录下的flutter/bin目录作为变量值添加到PATH环境变量中，就可以在Windows系统自带的命令行运行flutter相关命令了。

运行flutter doctor

同MacOS

1.1.4 升级SDK

查看SDK的分支

FlutterSDK有beta、dev、master、stable四个分支，其中stable是稳定分支,dev分支为开发分支，beta分支为测试分支，bug可能会比较多，查看分支可以使用flutter channel命令,比如:

Flutter channels:
  master
  dev
  beta
* stable

*号代表当前SDK所在的分支。

升级SDK

使用以下命令升级SDK

flutter upgrade 或者
flutter upgrade  --force 强制升级

这个命令会同时升级SDK和依赖包，如果只想升级依赖包可以使用以下两个命令:

flutter packages get 获取依赖包
flutter packages upgrade 获取最新版本的依赖包

1.1.5 为IDE配置Flutter插件

谷歌官方推荐了两款IDE作为Flutter项目的开发工具，AndroidStudio和VS CODE，为了能在IDE中创建Flutter项目，我们需要为IDE配置Flutter相关插件。Flutter相关插件主要有两个Dart插件和Flutter插件,由于AndriodStudio是基于IntelliJ IDEA开发的，所以AndroidStudio的Flutter和Dart插件可以从JetBrains官网下载，而VS CODE的插件需要从VS CODE官网下载，两个平台的下载地址:

Android Studio配置Flutter插件

安装步骤(以MacOS为例):

1. 打开Android studio
2. 调用AndroidStudio->Preferences->Plugins->Marketplace选项
3. 搜索Dart\Flutter，安装（建议先安装Dart，因为Flutter依赖Dart）
4. 重启AndroidStudio

VS CODE配置Flutter插件

安装步骤(以MacOS为例)

1. 打开VS CODE
2. 调用 View>Command Palette
3. 输入 Install,选择 Extensions: Install Extension
4. 输入 flutter 回车搜索，找到列表中的Flutter项，安装
5. 安装完成之后重启VS CODE
6. 验证配置
   调用 View>Command Palette
   输入 doctor, 然后选择 Flutter: Run Flutter Doctor
   查看OUTPUT窗口中的输出是否有问题

1.1.6 运行Flutter项目

AndroidStudio下创建并运行Flutter项目

创建Flutter项目:

1. 调用 file->new->new Flutter Project
2. 填写项目名称

运行Flutter项目:
项目创建完成之后就可以运行了，可以选择在真机或者模拟器上运行，这里选择的真机运行。

USB 连接电脑和手机之后，打开手机的开发者选项，找到允许USB调试，开启USB调试模式，这时候就能在Android Studio的设备列表里找到刚刚连接上的设备了，然后点击旁边的绿色倒三角，开始运行。

VS CODE下创建并运行Flutter项目

创建Flutter项目:

1. 启动VS CODE
2. 调用View>Command Palette
3. 输入flutter，选择 Flutter: New Project
4. 输入项目名称
5. 指定项目存放的位置
6. 等待项目创建完成，完成之后会自动打开Main.dart文件

运行Flutter项目:

1. 连接手机或者模拟器
2. 打开terminal控制台,输入flutter devices，显示已连接的设备
3. 输入flutter run，在已连接的设备上安装项目