Flutter (一) 环境搭建

之前做过一段时间的RN,也就部署环境,简单的页面书写,调用接口,调试,只是入了个门,毕竟当时技术有限。本想抽空再深入,奈何Flutter最近在移动圈子太火爆,在加上可以跨平台。所以入个坑,希望21天时间,可以从入门到放弃。或者做一个简单app。一边看中文网,一边实操。

搭建Flutter开发环境

由于Flutter会同时构建Android和IOS两个平台的发布包,所以Flutter同时依赖Android SDK和iOS SDK,在安装Flutter时也需要安装相应平台的构建工具和SDK。说一下windows 安装,毕竟穷啊,IOS玩不起。

在Windows上搭建Flutter开发环境

系统要求
  • 操作系统: Windows 7 或更高版本 (64-bit)

  • 磁盘空间: 400 MB (不包括Android Studio的磁盘空间)

  • 工具: Flutter 依赖下面这些命令行工具

    • PowerShell 5.0 或更新的版本
    • Git for Windows (Git命令行工具);

    如果已安装Git for Windows,请确保可以在命令提示符或PowerShell中运行 git 命令

一、使用镜像

由于在国内访问Flutter有时可能会受到限制,Flutter官方为中国开发者搭建了临时镜像,大家可以将如下环境变量加入到用户环境变量中

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

在这里插入图片描述

此为临时镜像,具体以 https://flutter.io/community/china 为准

二、获取Flutter SDK

去flutter官网下载其最新可用的安装包,官网地址:https://flutter.io/sdk-archive/#windows
注意,Flutter的渠道版本会不停变动,请以Flutter官网为准。另外,在中国大陆地区,要想正常获取安装包列表或下载安装包,可能需要翻墙,读者也可以去Flutter github项目下去下载安装包,地址:https://github.com/flutter/flutter/releases

在这里插入图片描述

  • 将安装包zip解压到你想安装Flutter SDK的路径(如:C:\src\flutter;注意,不要将flutter安装到需要一些高权限的路径如C:\Program Files\)
  • 在Flutter安装目录的flutter文件下找到flutter_console.bat,双击运行并启动flutter命令行,接下来,你就可以在Flutter命令行运行flutter命令了(我用管理者权限就可以了,双击闪退)

在这里插入图片描述

更新环境变量

如果你想在Windows系统自带命令行(而不是)运行flutter命令,需要添加以下环境变量到用户PATH:

  • 转到 “控制面板>用户帐户>用户帐户>更改我的环境变量”

  • 在“用户变量”下检查是否有名为“Path”的条目

    • 如果该条目存在, 追加 flutter\bin的全路径,使用 ; 作为分隔符.
    • 如果该条目不存在,创建一个新用户变量 Path ,然后将 flutter\bin 的全路径作为它的值

    重启Windows以应用此更改

运行 flutter doctor命令

在Flutter命令行运行如下命令来查看是否还需要安装其它依赖,如果需要,安装它们:

flutter doctor

该命令检查你的环境并在命令行窗口中显示报告。Dart SDK已经在打包在Flutter SDK里了,没有必要单独安装Dart。 仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务。

[-] Android toolchain - develop for Android devices
    • Android SDK at D:\Android\sdk
    ✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
    • Try re-installing or updating your Android SDK,
      visit https://flutter.io/setup/#android-setup for detailed instructions.

第一次运行flutter命令(如flutter doctor)时,它会下载它自己的依赖项并自行编译。以后再运行就会快得多。缺失的依赖需要安装一下,安装完成后再运行flutter doctor命令来验证是否安装成功。
在这里插入图片描述

之前安装过 android studio,就不演示下载了,记得安装插件,还有vscode

在这里插入图片描述

在这里插入图片描述

flutter doctor --android-licenses

在这里插入图片描述
路径在一开始git下来的flutter文件下,bin\cache\dark-sdk

在这里插入图片描述

在这里插入图片描述

powershell版本5以上

运行flutter run命令卡在:Resolving dependencies…

buildscript {
    ext.kotlin_version = '1.3.50' // 好像vscode创建没有
    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.2.1'
    }
}
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' }
    }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值