乐趣区

自学flutter系列flutter-开发环境搭建

以下安装过程仅是 winodws7 系统下的安装过程。windows 其它系统的安装和 win7 下安装大致差不多。
如果是其它的如 linux, 苹果的 OSX 系统。请参考 flutter 的官方文档来配置。

1. 安装 Flutter

1.1 下载

下载 flutter_windows_v1.9.1+hotfix.2-stable.zip

解压到你需要安装的盘。如果我的:E:\soft\flutter

1.2 配置环境变量

回到桌面,右键计算机 -> 属性 -> 高级系统设置 -> 环境变量 打开环境变量设置界面

在用户变量里找到 path, 把 E:\soft\flutter\bin 添加到 path.

由于在国内访问 Flutter 有时可能会受到限制,Flutter 官方为中国开发者搭建了临时镜像。再在用户变量添加下面两个变量

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

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

1.3 检查是否安装成功

打开 cmd, 运行 flutter,

flutter

能看到像下面这样的内容就说明 flutter 安装成功了。

2. jdk 安装

下载 jdk 安装,

打开计算机环境变量。添加 如下变量:

JAVA_HOME=jdk 安装目录

classpath=.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar;

在 path 变量中增加 %JAVA_HOME%\bin;

3. 安装 Android studio 和 android 环境

3.1 下载 android studio

打开 android 官网下载 android studio,

如果打不开也可以到 http://www.android-studio.org 网站下载

点击运行安装 android studio.

例如我的:

 Android studio 安装目录:E:\Android\Android Studio
 Android SDK 目录: E:\Android\Sdk

3.2 安装 Android sdk

安装完成第一次运行时,android studio 会提示你要安装一些 sdk, 直接点下一步安装就好。

注意:这一步需要花费比较长的时间等待,完成之后,Android Studio 默认的会为你安装好一个 android 版本的 sdk, 并创建好一个相应的的模拟器。

添加环境变量 ANDROID_HOME,把你 android SDK 的路径填上。

在 path 中添加 %ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools ;

重新打开 cmd。

如果想安装更多版本的 sdk,可以在菜单栏的 tools -> SDK Manage 进去管理 sdk

至此,我们的开发环境基本上就安装好了。下面来运行一下 flutter doctor 检查下当前的环境是否可以。

# 运行 flutter doctor 出在如下面的提示,说明我们的 flutter 开发环境已经安装好了。λ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, v1.9.1+hotfix.2, on Microsoft Windows [Version 6.1.7601], locale zh-CN)
[√] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
[√] Android Studio (version 3.5)
[!] Connected device
    ! No devices available

! Doctor found issues in 1 category.

错误处理

  1. 未在环境变量中配置 ANDRIOD_HOME 错误, 运行 flutter doctor, 出现如下错误:

    Doctor summary (to see all details, run flutter doctor -v):
    [√] Flutter (Channel stable, v1.9.1+hotfix.2, on Microsoft Windows [Version 6.1.7601], locale zh-CN)
    [X] Android toolchain - develop for Android devices
        X Unable to locate Android SDK.
          Install Android Studio from: https://developer.android.com/studio/index.html
          On first launch it will assist you in installing the Android SDK components.
          (or visit https://flutter.dev/setup/#android-setup for detailed instructions).
          If the Android SDK has been installed to a custom location, set ANDROID_HOME to that location.
          You may also want to add it to your PATH environment variable.
    
    [√] Android Studio (version 3.5)
    [!] Connected device
        ! No devices available
    
    ! Doctor found issues in 2 categories.

    解决方法:

    在环境变量中配置变量 ANDRIOD_HOME = 你的 android SDK 目录。

  1. 提示 flutter doctor –android-licenses

    解决方法:

    输入 flutter doctor –android-licenses,接下来所有的输入 y 就可以了

  2. No devices available

    这个错误比较好解决,运行我们的 android 模拟器即可。

4. 插件安装

4.1 Android studio

 打开 File -> settings -> plugins, 搜索 Flutter 安装 

4.2 vscode

 打开插件标签搜索 flutter 安装 

5. 创建,并运行一个 flutter 程序

5.1 android studio

5.2 vscode

5.3 命令行

运行 flutter create flutter_demo

flutter create flutter_demo

5.4 运行我们的第一个 flutter 程序

我以 vscode 来讲。先把模拟器运行起来。

点击右下角的 No Device, 选择需要运行的模拟器点击运行。我这里就只有一个模拟器。如下图

再运行 flutter 程序

cd flutter_demo
flutter run  

app 运行起来如下图

Error runing Gradle 错误解决

运行时如果遇到了 Error runing Gradle 错误提示,这是因为墙的原因导致,解决方案是改为阿里的链接。

阿里链接:

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

需要修改的文件:

  • 在项目目录下的 android 目录下的 build.gradle 文件。
  • 修改 Flutter SDK 包下的 flutter.gradle 文件,具体的文件路径是:
Flutter SDK 目录 \packages\flutter_tools\gradle\flutter.gradle

把文件里的 google() 和 jcenter() 这两行改为阿里的链接.

附录:

  • flutter 官网
  • flutter 中文
  • flutter 第三方插件库
  • flutter 中文网
  • 书籍:flutter 实战
退出移动版