Flutter环境配置

Flutter环境配置+避坑

Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。

head

准备：

操作系统:windows7 64位

磁盘空间：大于3个G，官方指定400M，但并不实际

需要Git环境：前端必备工具

1. JAVA环境配置

首先，既然要写原生应用，而其是基于Android的，那我们就必须先去搭建一个JAVA的环境，先让我们去他的官网下一个：

JAVA下载地址：https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

java_1

这里我下的是8，如果你已经安装过，并且版本比较新也无所谓，它是向后兼容的，效果是一样的，根据自己的情况下载；

下载完后将他的环境变量配置一下，这里只给出大致，如果做不出来，可另查看相对教程

java_2

java_3

java_4

配完环境后，在终端全局中执行java如出现以下效果则为成功。

java_5

2. FlutterSDK下载

1.接下载就是我们的FlutterSDK了，我会给出下载地址，这个地址官方变动较大，如出现变动，可联系我来修改。

FlutterSDK：https://flutter.dev/docs/development/tools/sdk/releases#windows

2.这里版本不是很关键，推荐直接下稳定版的最新一款；

flutter_1

3.接下来将他解压，尽量避免把他放在权重高的文件夹中；

flutter_2

4.在bin目录中找到flutter.bat文件来打开应用；

flutter_3

5.这里建议将他也配置到全局变量里；

flutter_4

6.另外，Flutter是需要联网的，如果我们有梯子或者能安全上网则不谈，如果没有，也顺便将联网的环境也给配了：

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

flutter_5

7.接下来我们去终端运行flutter doctor看看有什么问题，这里我们在第一次运行时会有很多错误和警告，不过不用担心，我们慢慢来；

flutter_6

3.Android Studio的安装

Android Studio的安装和配置，在配合国内的上网环境，可以说是整个配置环节中最致命的一部分，相对的，只要我们这一部分完成了，Flutter的环境配置也就基本完工了

ps、这一步很耗费时间，另外这一步需要梯子，如不懂的朋友可以先去了解一下去搭个梯子。

1.第一步我们先去官网下载，向下拉，出现图中情况点下载；

Android Studio:https://developer.android.com/

a_1

2.下载完后安装此软件，就是下一步下一步，不做过多讲解，唯一需要注意的是安装到最后需要从谷歌上下载很多插件，需要安全上网（梯子）；

如实在不会：https://www.cnblogs.com/xiadewang/p/7820377.html

3.安装完毕后打开软件，然后找到Plugin的配置，搜索Flutter插件，由于网络环境的问题，可能会搜索不到任何插件，当然搜到了最好，如果没有，也不用去网上找解决方案，笔者基本完了全网那些教程，八成不靠谱，这里直接给出插件资源，下载直接从本地导入即可；

a_2

Flutter插件：https://pan.baidu.com/s/1mfG_hLpFItZ3YVf_4v2Ahw 密码：32er

4.安装Android证书:

1	flutter doctor --android-licenses

安装证书时会出现很多选项，犹豫就会败北，一律全选y（一大堆英文也看不懂），接下来我们在执行flutter doctor会发现错误明显少了；

4.vscode的环境配置

比起Android Studio，我更推荐使用vscode来编写，因为他更轻量，更快;

1.vscode中同样也需要安装插件，打开插件栏，安装Flutter和Dart两个插件

v_1

v_2

2.Shift+Ctrl+p调出命令行，输入Flutter，选择new project创建一个新项目

v_3

3.又是因为网络环境的原因，需要去修改一些配置

一是在我们的项目中找到 android-->build.gradle，注释掉google()与jcenter(),替换为阿里云的镜像，注意两个都要改;

1
2
3

maven { url 'https://maven.aliyun.com/repository/google' }
      maven { url 'https://maven.aliyun.com/repository/jcenter' }
      maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }

v_4

二是在Flutter SDK包下的flutter.gradle文件，以下是我的安装路径，因人而异：他的修改和第一个相同，注掉原来的路径换上阿里云的路径；

1	D:Flutter\flutter_v1.7.8+hotfix.4\flutter\packages\flutter_tools\gradle

v_5

5.模拟器选择

关于模拟器，它是用来调试用的，Android Studio本身是有自带模拟器的，但是很慢，而且有一大堆配置，对新手不是很建议，这里推荐使用三方模拟器，平时不用还可以玩玩游戏 ︿(￣︶￣)︿

1.夜神模拟器

1 2	终端配置代码 nox_adb.exe connect 127.0.0.1:62001

2.逍遥模拟器

1 2	终端配置代码 adb connect 127.0.0.1:21503

m_1

如图为配置成功，可执行flutter run来运行项目，首次运行会很慢

m_3

注：vsc一般会匹配不到三方模拟器，需要去模拟器的安装目标打开终端执行以上代码

6.安全上网

全文一直有反复提到安全上网这个词，其实就是在国内有一些限制导致我们无法访问外网，而Flutter又是谷歌的东西，他的大部分插件也好，库也好，都是要去谷歌下载的，而谷歌我们知道在国内是访问不了的，这里我们就需要自己去想办法，找工具，可以使VPN，也可以是自己搭一个梯子，这里只要你用的方法可以让你成功访问Google，那就可以，没有死方法，任何东西都是可以变通的，至于怎么用vpn、梯子，这里就不做讲解，有兴趣可以去自行了解，上外网对于一名程序员来讲其实还是挺重要的。

7.快捷键

最后在为大家列几个虚拟机调试的快捷键，供大家参考：

r 键：点击后热加载
p 键：显示网格，布局中很有用
o 键：切换Android和iOS的预览模式
q 键：退出调试预览模式

结语：

Flutter其实并不难配，主要是环境影响导致一系列问题，如果不用Android Studio的话可以只下载不配置，但是Android Studio必须要有。