Flutter 专题01 图解 Windows 环境下安装配置环境

Posted 2021-04-29 阿策小和尚

      Flutter 是谷歌的移动 UI 框架，可以快速在 ios 和 android 上构建高质量的原生用户界面。 同时可以与现有的代码一起工作。Flutter 已经发布很长一段时间了，有不少大神都在学习和应用，和尚认为大前端方向是趋势，也学习一下。
      Flutter 中文网 中对 Flutter 讲解非常全面，和尚也想好好学习一下，但是头一步配置环境就难倒和尚了，还真是当头一棒啊！和尚觉得官网可能觉得配置环境太简单了，所以说明的简洁明了，但对于和尚这种基础差的还真得花时间研究一下。因此和尚第一篇小博文就是整理一下在 Windows 环境下如何安装配置 Flutter 环境。

系统环境

1. Flutter 建议 Windows 环境在 64 位 Windows7 及以上，和尚的环境是 Windows10；

2. 磁盘空间要超过 400MB，和尚觉得现在的电脑对这些空间都是绰绰有余的；

3. 电脑已安装 Git；

安装图解

Tips: 优先处理第 5 步，可以减少很多不必要的问题！！！

1.  cmd -> git clone https://github.com/flutter/flutter.git，clone 需要一段时间，如图；

2.  添加用户 Path 路径：控制面板 -> 系统和安全 -> 系统 -> 高级系统设置 -> 环境变量，Path 变量中添加 Flutter 路径，到 \bin 级；一般是在 C:\User\Your Name\Flutter\bin，若找不到可以在磁盘中搜索一下；

3.  cmd 中运行 Flutter：flutter doctor，但是不幸报错，提示无法连接远程服务器，如图：

4.  和尚尝试解决这个问题，于是在 cmd 中编辑：

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

可以下载，但是 Builde 环节出错，如图：

5.  第 3 步如果是有梯子的情况下正常，但和尚没有梯子，所以忽略了进门第一件重要的事，配置国内环境，在环境变量中添加用户 Path 变量：PUB_HOSTED_URL -> https://pub.flutter-io.cn 和 FLUTTER_STORAGE_BASE_URL -> https://storage.flutter-io.cn，强烈建议优先配置这一步，会省去很多不必要的麻烦，和尚仅从自己遇到的问题顺序整理，如图；

6.  重新打开 cmd -> flutter upgrade，之后等待进行，即可顺利安装：

7.  电脑连接手机，打开开发者模式，打开 cmd -> flutter devices，检测是否连接设备，如图：

      至此，Flutter 环境安装配置成功，虽然安装配置环境是基础的基础，但当看到 "Welcome to Flutter!" 时，和尚还是有一丝说不出当自豪和欣喜。还要继续学习和研究啊！

---

      Flutter 是一种比较新的跨平台方式，和尚觉得很有必要学习一下，如果可以的话和尚想结合 Demo 整理一个小系列。
      和尚深刻理解到，看一百遍不如动手操作一遍，可能会遇到各种意想不到的问题，对自己也是一种挑战。

---