Flutter 开发环境搭建

StoneLee 发布于 文章字数: 606 阅读次数:

Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。

获取Flutter SDK

不论是Windows、MacOS、Linux系统,统一采用Git方式下载,亲测试高效可用,这里下载开发版本,示例如下:

在Flutter文件夹路径下,输入如下命令行代码,自动下载最新的代码。

git clone -b dev https://github.com/flutter/flutter.git

设置环境变量

1、设置Flutter 系统环境变量

FLUTTER_HOME : \Flutter\flutter\bin

Path下添加:FLUTTER_HOME\bin;

2、添加临时镜像

Flutter官方为中国开发者搭建了临时镜像,将其添加到用户环境变量中.


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

3、执行命令检查安装情况:

flutter doctor

4、修改flutter.gradle配置文件

flutter.gradle 文件位于 flutter\packages\flutter_tools\gradle 目录下

默认配置下,flutter调试运行时,Gradle下载依赖库失败的问题;通过修改flutter.gradle 文件,设置为阿里maven代理库就可以解决。

设置如下:


    buildscript {
        repositories {
            maven {
                //url 'https://dl.google.com/dl/android/maven2'
                url 'http://maven.aliyun.com/nexus/content/groups/public/'
            }
            jcenter()
        }
        dependencies {
            classpath 'com.android.tools.build:gradle:3.1.2'
        }
    }

安装开发编辑器

这里推荐VS Code、Android Studio 和 Intellij Idea,用起来都比较顺手。但是Android Studio必须安装,用户创建Android模拟器,启动 Android Studio>Tools>Android>AVD Manager 并选择 Create Virtual Device。

安装Flutter和Dart插件

安装好开发编辑器后,接着安装Dart和Flutter插件,这里要先安装Dart插件。

其中对于Intellij Idea 和 Android Studio 开发编辑器,需要去官网下载对应版本的插件到本地手动安装,安装好后,重启即可生效。在线下载容易失败。

创建新应用

按照以上步骤安装设置好,就可以创建新应用 New Flutter Project。

修改Flutter项目中android 对应的build.gradle配置文件

build.gradle配置文件的默认内容如下:


    buildscript {
        repositories {
            google()
            jcenter()
        }

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

    allprojects {
        repositories {
            google()
            jcenter()
        }
    }

    rootProject.buildDir = '../build'
    subprojects {
        project.buildDir = "${rootProject.buildDir}/${project.name}"
    }
    subprojects {
        project.evaluationDependsOn(':app')
    }

    task clean(type: Delete) {
        delete rootProject.buildDir
    }

修改其中的buildscript => repositories {} , 添加:


    maven {
        url 'http://maven.aliyun.com/nexus/content/groups/public/'
    }

修改结果如下:


    buildscript {
        repositories {
            google()
            maven {
                url 'http://maven.aliyun.com/nexus/content/groups/public/'
            }
            jcenter()
        }

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

注意:必须将maven() 仓库 置于 jcenter() 之前,否则flutter调试运行时 依赖库下载失败。