Flutter开发环境配置以及踩坑 - 好文

前言

移动端原生开发，在前几年很火，当时供不应求，虽然当时有H5可以替代部分功能，对原生还是造成不了很大威胁，后来出了Ionic，React
Native，以及前段时间的快应用，小程序，又有这个谷歌的Flutter，原生程序员，有必要学习学习新技术了。之前接触过Ionic，RN，小程序，因为平时公司还属于比较传统的，对这些新技术没有使用，所以也只是学习学习。
这次的Flutter，和之前不一样的一点，是Google用以帮助开发者在Ios和Android两个平台开发高质量原生应用的全新移动UI框架，主要特点可以参看
5 个你也许会喜欢 Google Flutter 的理由
<https://www.oschina.net/translate/5-reasons-why-you-may-love-flutter>，这里有介绍视频
<https://v.youku.com/v_show/id_XMzQyNTE1NDMxMg==.html>。学习可以参考中文官网
<https://flutterchina.club/setup-windows/>

环境配置

首先，先把git下载下来，git下载 <https://git-scm.com/download/win>
，下载下来，一路next，检验是否安装成功，打开Git Bash，输入git命令，

在git中，输入命令：
git clone -b beta https://github.com/flutter/flutter.git
等候下载

我这个是下载失败，可以多尝试几次，下载完成后，继续输入
export PUB_HOSTED_URL=https://pub.flutter-io.cn
再输入：
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
PUB_HOSTED_URL和FLUTTER_STORAGE_BASE_URL都是针对国内不能访问国外网络而设置的镜像

继续输入
export PATH=C:\Users\intel\flutter\bin:$PATH
切记切记：这个地址，是自己安装的flutter文件地址，不要在网上直接复制，需要改成自己的
安装完以后，在环境变量中，将flutter路径设置到path中，注意用;隔开

踩坑1
win7好像安装flutter不成功，安装Flutter过程中，会提示Unknown operating system. Cannot install
Dart SDK.，可以打开flutter目录下的bin文件夹里的flutter_console.bat，输入flutter
doctor，安装。或者用虚拟机VMware 安装了win10，在win10系统上安装Flutter
踩坑2
使用VMware安装好win10，启动虚拟机的时候，提示EFI VMware Virtual SCSI Hard Drive (0.0) …
unsuccessful EFI VMware Virtual IDE CDROM Drive (IDE 1.0) …
unsuccessful，解决方法：在虚拟机目录下，找到VMX文件，将里边的firmware=”efi”删除，重启

android studio 配置
需要安装Android Studio 3.0及以上版本和Android SDK，Flutter需要Flutter和Dart插件才能用
，File –> settings –> Plugins –> Browse
repositories，输入Dart，安装完，同样的操作，输入Flutter,(我原来先安装的Flutter，一直安装不好，就先安装Dart了)

写个demo
打开AS，点击 File –> New Flutter Project，选择Flutter application，项目名字要小写，Flutter sdk
path选择下载好的，

然后next，我在创建过程中，发现创建很慢，如果出现这种情况，应该在用户变量中，设置国内镜像，

PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
创建完成，界面如下：

可以看到，有android 和ios两个文件夹，运行模拟器，应该使用Android 4.1（API level
16）或更高版本的Android设备，我用模拟器运行，报错，现在换成真机是可以运行的，建议还是使用真机调试吧，运行的结果：

这个界面，在项目中对应的是lib下的main.dart，有一个新的亮点，在工具栏里，有一个闪电图标，点击，在代码中修改的东西，在真机上立马显现出来，不用重新运行

不过，有时候好像保存以后，也会在界面上显示，确实比每次更改，都要经过漫长的等待才能看到效果好得多了

热门工具换一换