Flutter环境搭建（填坑）

最近发现身边的很多朋友都在推荐flutter，前两天去上海参见“第三届VueConf大会”中也提到了这个，所以带着好奇，准备学习下Flutter，学习的第一关当然还是搭环境了，鉴于搭环境过程中有太多坑了，所以写篇博客记录一下安装 Flutter通过以下命令，clone 最新的 Flutter 仓储到本地：git clone https://github.com/flutter/flutte...

qq_24800489

2818人浏览 · 2019-06-10 22:01:08

qq_24800489 · 2019-06-10 22:01:08 发布

最近发现身边的很多朋友都在推荐flutter，前两天去上海参见“第三届VueConf大会”中也提到了这个，所以带着好奇，准备学习下Flutter，学习的第一关当然还是搭环境了，鉴于搭环境过程中有太多坑了，所以写篇博客记录一下

安装 Flutter

通过以下命令，clone 最新的 Flutter 仓储到本地：
git clone https://github.com/flutter/flutter.git
将 clone 的 Flutter 仓储中 bin 目录的完整路径，添加到系统环境变量 path 中。

在这里插入图片描述

3、由于flutter需要访问和国外网站所以需要添加系统映射。

在这里插入图片描述

Flutter官方为中国开发者搭建了临时镜像：

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

最后运行 flutter doctor 检查当前的开发环境是否存在问题。

在这里插入图片描述

配置java环境

1、环境变量（主要）

(1) 新建->变量名"JAVA_HOME"，变量值"C:\Java\jdk1.8.0_05"（即JDK的安装路径）

(2) 编辑->变量名"Path"，在原变量值的最后面加上“;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin”

(3) 新建->变量名“CLASSPATH”,变量值“.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar”

（win10系统要注意分开）

配置Android环境

主要勾选的包

1、主要的三个包

在这里插入图片描述

2、需要用到的android sdk

在这里插入图片描述

3、最后一个

在这里插入图片描述

4、接受许可协议，安装

在这里插入图片描述

配置环境变量

ANDROID_HOME C:\Android

path新增两个：%ANDROID_HOME%\tools %ANDROID_HOME%\platform-tools

验证命令：adb

安装夜神模拟器

1、将C:\Android\platform-tools下的adb.exe，替换Nox/bin下的adb.exe

2、将C:\Android\platform-tools下的adb.exe，替换Nox/bin下的nox_adb.exe

VS Code安装flutter插件

在这里插入图片描述

创建flutter项目

ctrl+shift+p   
再输入项目名
选择项目路径即可

运行flutter项目

flutter run

常见错误

1、This is taking an unexpectedly long time。

这是因为无法通过代理和翻墙的方式下载gradle-4.10.2-all，不排除是网络原因：

所以采用本地安装方式是最稳的，即：

安装至：
C:\Users\Administrator\.gradle\wrapper\dists\gradle-4.10.2-all\9fahxiiecdb76a5g3aw9oi8rv
路径下。

2、一直停留在Resolving dependencies…

获取不到的原因一般是因为在中国没办法访问谷歌资源（有外网，翻墙等的除外）

此时的解决办法是改用阿里的镜像：

分两步，

第一步：
在修改掉项目下的android目录下的build.gradle文件，把google() 和 jcenter()这两行去掉。
buildscript {
    repositories {
        //注视掉原有的，采用镜像地址下载
        // google()
        // jcenter()
        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'}


    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.1.2'
    }
}


allprojects {
    repositories {
//        google()
//        jcenter()
        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 SDK包下的flutter.gradle文件：
C:\flutter\packages\flutter_tools\gradle
如上即可
这样国内没办法访问谷歌资源的问题就解决了

但是依然有问题

仔细看报错信息后，发现找不到以下资源地址
        -  https://maven.aliyun.com/repository/jcenter/com/android/tools/build/gradle/3.2.1/gradle-3.2.1.pom
        -  https://maven.aliyun.com/repository/jcenter/com/android/tools/build/gradle/3.2.1/gradle-3.2.1.jar
        -  http://maven.aliyun.com/nexus/content/groups/public/com/android/tools/build/gradle/3.2.1/gradle-3.2.1.pom
        -  http://maven.aliyun.com/nexus/content/groups/public/com/android/tools/build/gradle/3.2.1/gradle-3.2.1.jar

看到这里说明阿里链接是配置上了的，之所以找不到是因为gradle-3.2.1这个3.2.1版本太高了，应该是最新的

阿里连接中的gradle最高版本好像才3.1.2，所以获取不到

所以，解决办法是将项目下的android目录下的build.gradle文件和flutter SDK包下的flutter.gradle文件中的gradle版本改为阿里镜像中存在的版本:

classpath 'com.android.tools.build:gradle:3.1.2'

但是我只改了flutter SDK包下的flutter.gradle文件，也是可以的。亲测有效！

3、提示AndroidSDK版本错误

Failed to install the following Android SDK packages as some licences have not been accepted.

    build-tools;28.0.3 Android SDK Build-Tools 28.0.3

 To build this project, accept the SDK license agreements and install the missing components using the Android Studio SDK Manager.

 Alternatively, to transfer the license agreements from one workstation to another, see http://d.android.com/r/studio-ui/export-licenses.html

解决方式，是在Android SDK Manager中将对应的版本安装一下即可

window10 开夜神模拟器蓝屏解决方法：

1、打开控制面板-》程序-》启用或关闭windows功能
2、去掉勾选的hyper-v选项，然后重启

本以为这样万事大吉，随便安装了一个安卓模拟器，安装成功，运行，提示vt异常，然后蓝屏，哦豁，这电脑买来第一次蓝屏。我以为是模拟器垃圾，换一个，还是老样子，顿时就郁闷了，一运行就蓝屏，遭不住啊。
后来经过仔细找资料，发现一个问题，就是 hyper-v关闭不彻底，需要通过 bcedit 指令关闭。
按下win+x,选择windows powershell(管理员)，执行 
bcdedit /set hypervisorlaunchtype off
进行关闭掉hyperv启动类型，然后重启，发现安卓模拟器就正常使用了，果然是这个问题。
当然后面想要开启则输入
bcdedit / set hypervisorlaunchtype auto
然后重启。

Android SDK报错（flutter Android license status unknown. Try re-installing or updating your Android SDK Manager. 问题）解决：

执行：

flutter doctor --android-licenses
执行上面这个命令，它会提示让你进入AndroidSDK安装目录下面的tools\bin执行：

sdkmanager.bat --update

报错：

Warning! This package referenced a Flutter repository via the .packages file that is no longer available. The repository from which the 'flutter' tool is currentlyexecuting will be used instead.
  running Flutter tool: D:\flutter
  previous reference  : C:\flutter
This can happen if you deleted or moved your copy of the Flutter repository, or if it was on a volume that is no longer mounted or has been mounted at a different 
location. Please check your system path to verify that you are running the expected version (run 'flutter --version' to see which flutter is on your path).

只需要删除项目根目录下的.packages文件，再重新flutter run即可，会自动生成新的.packages文件。

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^