01 - Flutter环境搭建

[TOC]
写在最前面，想玩flutter最好有科学上网的梯子，否则被墙的整个人都暴躁了

下载SDK

在目标目录使用git拉取flutter的sdk

# 移动到目标目录
cd ${HOME}/env
# 拉取sdk
git clone https://github.com/flutter/flutter.git

环境变量配置

• 需要提前配置好安卓开发环境，可以提前配置好jdk,android sdk等环境变量

• 需要配置flutter sdk的环境变量

• 需要配置flutter的镜像地址

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

.bash_profile的参考配置

# jdk begin
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_144.jdk/Contents/Home
# jdk end
# android sdk begin
ANDROID_HOME=/Users/rexih/Library/Android/sdk
ADB_HOME=/Users/rexih/Library/Android/sdk/platform-tools
# android sdk end
#android ndk begin
NDK_HOME=/Users/rexih/Library/Android/sdk/ndk-bundle
CMAKE_HOME=/Users/rexih/Library/Android/sdk/cmake/3.6.4111459
#android ndk end
# flutter begin
FLUTTER_HOME=/Users/rexih/env/flutter
PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
# flutter end
PATH=$FLUTTER_HOME/bin:$FLUTTER_HOME:$CMAKE_HOME/bin:$ANDROID_HOME/:$ANDROID_HOME/tools:$ADB_HOME:$NDK_HOME:$JAVA_HOME/bin:$PATH:.
CLASSPATH=JAVA_HOME/lib/tools.jar:$JAVA_HOME/lib/dt.jar:.
export JAVA_HOME
export ANDROID_HOME
export ADB_HOME
export NDK_HOME
export CMAKE_HOME
export PATH
export CLASSPATH
export FLUTTER_HOME
export PUB_HOSTED_URL
export FLUTTER_STORAGE_BASE_URL

Android Studio插件安装

打开as（本文使用的是3.2.1 stable）的plugin，下载插件Flutter，会自动下载插件Dart，确保两个插件勾选，重启as

环境诊断与修复

flutter提供doctor指令帮助用户诊断开发环境是否可用，根据命令行里的诊断结果逐步修复即可

• 第一次运行会自动下载Dart SDK

  Downloading Dart SDK from Flutter engine 
  # ...
  Building flutter tool...
  # ...
  Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure
  you trust this source!
  # ...
  Doctor summary (to see all details, run flutter doctor -v):
  # ...
  

• 诊断结果会告知去设置Android SDK的环境变量

• 诊断结果会告知运行flutter doctor --android-licenses通过licenses以使用

  [!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
      ! Some Android licenses not accepted.  To resolve this, run: flutter doctor
        --android-licenses
  

• 诊断结果会告知安装AS插

  [!] Android Studio (version 3.2)
      ✗ Flutter plugin not installed; this adds Flutter specific functionality.
      ✗ Dart plugin not installed; this adds Dart specific functionality.
  

• 诊断结果会告知运行设备情况

  [!] Connected device
      ! No devices available
  

• 诊断结果会告知idea和iOS的开发环境的可用性

设置gradle及代码仓库地址

• 国内被墙的很严重。gradle下载太慢了。建议先下载好gradle的对应版本，放置到本地gradle仓库里，以加快构建速度。（移动宽带直接下载也挺慢的）

• 手动下载gradle对应版本。例如下载gradle 4.10.2 地址:https://downloads.gradle.org/distributions/gradle-4.10.2-all.zip，下载完成后放到${HOME}/.gradle/wrapper/dists/gradle-4.10.2-all/9fahxiiecdb76a5g3aw9oi8rv，解压，修改文件锁gradle-4.10.2-all.zip.ok

• 使用镜像替代flutter的脚本仓库。找到flutter sdk的根目录，打开packages/flutter_tools/gradle/flutter.gradle，修改仓库地址

  buildscript {
      repositories {
          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" }
          // google()
          // jcenter()
      }
      dependencies {
          classpath 'com.android.tools.build:gradle:3.2.1'
      }
  }
  

  ​

创建Flutter项目

• 配置好开发环境后，AS新建项目时会增加新的创建选项Start a new Flutter project

• 设置项目名称时，必须遵守其命名规范，小写加_下划线，否则会提示

  Invalid project name: 'T' - must be a valid Dart package name (lower_case_with_underscores)
  

• 点击播放键编译运行项目

热重载

修改后，不点击播放键，直接ctrl+s保存一下源文件，发现设备上直接同步了修改

1. 要查看您的更改, 只需调用 Save All (cmd-s / ctrl-s), 或点击 热重载按钮 (带有闪电⚡️图标的按钮).

flutter相关指令

查看连接设备

flutter devices

1 connected device:

Android SDK built for x86 • emulator-5554 • android-x86 • Android 9 (API 28)
(emulator)

切换flutter到Stable版本

# 查看可用版本
flutter channel
# 切换到stable版本
flutter channel stable
# 切换版本后再次调用flutter指令会重新配置开发环境
flutter

其他

离线下载flutter和dart插件

9212-flutter
6351-dart

卡在Creating Flutter Project

查看项目目录下是否已经生成项目文件，如果有，强制关闭as进程，重启后打开此项目

flutter packages get运行时提示等待另一个flutter指令

Waiting for another flutter command to release the startup lock…

1. 打开flutter的安装目录/bin/cache/
2. 删除lockfile文件
3. 删除不掉则强制退出Dart.exe再删除
4. 重启AndroidStudio

参见issues 7768

Resolving dependencies...

改android里build.gradle脚本的仓库源

buildscript {
    repositories {
        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' }
//        google()
//        jcenter()
    }

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

allprojects {
    repositories {
        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' }
//        google()
//        jcenter()
    }
}