flutter安装详解--初体验--问题解决(win10)

一、下载安装

1.下载

打开如下链接
https://flutter.cn/docs/get-started/install
选择自己的操作系统,我的是win10,所以选择windows
然后点击图中的按钮下载最新版本 stable 的 Flutter SDK

flutter安装详解--初体验--问题解决(win10)_第1张图片

当然下载好了就解压到某一个目录下

2.配置环境变量

将刚刚解压的flutterwen文件夹下的bin所在的目录配置到环境变量的Path(没有就新建一个)中。
直接上图吧,清晰明了


flutter安装详解--初体验--问题解决(win10)_第2张图片

3.开始安装flutter的sdk,安装的时候可能会很慢,因为访问的是外国的,所以你懂的。但是可以通过添加镜像

PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
你可以在dos命令行中分别输入
set PUB_HOSTED_URL=https://pub.flutter-io.cn
set FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
也可以像上图一样手动添加,如下图

flutter安装详解--初体验--问题解决(win10)_第3张图片

flutter安装详解--初体验--问题解决(win10)_第4张图片

4.安装

在dos命令行输入以下命令

flutter doctor 

Flutter 就会自动配置安装


flutter安装详解--初体验--问题解决(win10)_第5张图片

flutter会自动检测一系列的项,编辑器的话Android studio,IntelliJ IIDEA,VS Code安装一个即可
图中第二项报了一个感叹号,我们需要处理以下
输入以下命令

flutter doctor --android-licenses

接下来需要输入好几个y 来确定授权,完毕后再次输入flutter doctor 可以发现只有最后一项感叹号,没有可用设备,开一个模拟器或者链接真机就可以了。

二、体验

1.工具下载

打开android studio,找到Settings,再点击Plugins,在搜索框搜索flutter


flutter安装详解--初体验--问题解决(win10)_第6张图片

我这里已经安装过了,没有安装就点击install,期间会弹出安装Dart的提示,这个当然也是需要安装的

2.新建工程

点击 New Flutter Project...


flutter安装详解--初体验--问题解决(win10)_第7张图片

选中第一个,Next


flutter安装详解--初体验--问题解决(win10)_第8张图片

命名选中sdk所在地址,继续Next
flutter安装详解--初体验--问题解决(win10)_第9张图片

然后输入包名,就Finish吧

3.运行项目

打开模拟器或者连接真机,点击那个绿绿的按钮


flutter安装详解--初体验--问题解决(win10)_第10张图片

过程并非如此顺利

卡在Initializing gradle

这个事在android开发过程中也遇到过,估计是下载gradle,然后网不给力就会出现,一个最简单的方法是挂代理,这个我没实践,具体可以参考其他资料。第二就是手动下载后放到gradle_dir目录下,我创建项目的时候,工程使用的gradle版本是3.1.2,ubuntu系统gradle默认目录是~/.gradle/,下载后放到wrapper/dists/里,在terminal输入flutter config --gradle-dir /path/to/gradle

卡在Resolving dependencies或报错

在android/build.gradle里可以看到默认的配置为

 google()      
jcenter()

也就是说包是从google()和jcenter下载的,看到google,就懂了 又是长城的问题。方法:替换成阿里的源

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' }

修改后的文件:


flutter安装详解--初体验--问题解决(win10)_第11张图片

终于到了见证奇迹的时刻!


flutter安装详解--初体验--问题解决(win10)_第12张图片

项目跑起来了

希望本文对你有所帮助,过程中可能还会遇到其他问题,欢迎留言,小编会尽可能帮你解决哦。

你可能感兴趣的:(flutter安装详解--初体验--问题解决(win10))