美文网首页
Flutter环境搭建(二)

Flutter环境搭建(二)

作者: Kevin丶CK | 来源:发表于2020-04-12 17:54 被阅读0次

前言

这里就介绍macOS下搭建Flutter开发环境。做为跨平台的移动应用框架,自然会涉及到IOSAndroid。作为框架的学习,只在windows下搭建就没什么意义(仅为了开发就当我没说)。
如果需要Windows的教程,可以参考官网的在Windows上搭建Flutter开发环境

准备工作

1、macOS下安装XCode、Android Studio、VSCode开发工具。
最好都是最新版本,如有不会安装,自行查阅资料
2、Git。
3、命令行工具。

详细步骤

1、获取Flutter SDK

1.下载zip包
去Flutter官网下载其最新可用的安装包,下载地址:Flutter SDK releases

官网的Flutter SDK

2.github获取
Flutter的渠道版本会不停变动,请以Flutter官网为准。另外,在中国大陆地区,要想正常获取安装包列表或下载安装包,可能需要翻墙,也可以去Flutter github项目下去下载安装包,地址:https://github.com/flutter/flutter/releases
使用git下载:

cd ../flutter_sdk  //存放 flutter sdk的文件目录
git clone -b stable https://github.com/flutter/flutter.git

以上两种方法都可以,解压安装包到你想安装的目录如flutter_sdk

flutter_sdk
注意
如果没有科学上网工具(不能翻墙),下载所需的文件,有机率会下载失败。
2、配置环境变量

将Flutter添加到PATH中,可以在任何终端会话中运行flutter命令。

  • 打终端,输入一下命令,打开配置文件
vim ~/.bash_profile
  • 在打开的页面添加上下面代码
export PATH=/Users/kevin/Desktop/flutter/flutter_sdk/flutter/bin:$PATH
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PUB_HOSTED_URL=https://pub.flutter-io.cn                                             

三条地址分别是:
配置flutter全局路径:是你自己上面解压flutter sdk的路径(必须配置)
配置flutter镜像地址:如有需要,自行配置。
配置pub镜像地址:如有需要,自行配置。

  • 保存退出,运行 source $HOME/.bash_profile 刷新当前终端窗口。
    注意: 如果你使用终端是zsh,终端启动时 ~/.bash_profile 将不会被加载,解决办法就是修改 ~/.zshrc ,在其中添加:source ~/.bash_profile
vim ~/.zshrc  
image.png
  • 验证flutter/bin是否已在PATH中
echo $PATH
  • 运行flutter的命令帮助,正常会有如下显示

3、检查环境

flutter doctor

接下来flutter会自动检查你当前的电脑环境有什么缺失的配置,其中[✓]是通过,[✗]是不通过
。主要包括一下几项:
1、flutter当前分支,版本号,系统环境
2、开发所需要的安卓开发工具链
3、开发需要的iOS开发工具链
4、Android Studio安装情况
5、有没有已连接的可用设备(一般是手机设备)
如果全部安装好,就写显示如图:


下面列举几个重要的安装(我的已经全部安装好,不好给出截图),记得仔细分析检查出得结果,会告诉缺什么,怎么解决。
  • cocoapods安装
    是iOS开发用到的第三方管理工具,检查结果会告诉你使用以下命令安装
sudo gem install cocoapods 
  • iOS toolchain
    这个出错,那就没仔细看上面写的准备工作~~,安装最新版本就好,别纠结。
  • 安装安卓证书
    运行一下命令就好,一路y即可,也没仔细研究具体内容,有兴趣的自己研究研究。
flutter doctor --android-licenses

这里会有一个坑,如果是新配置的Android studio环境,运行上面命令会报错,原因是没有Android SDK 没有tools:



只要打开android studio,按下图打开,把hide Obsolete Packages取消,就会显示Android SDK Tools,勾选后apply下载后,在运行上面的命令即可。


4、升级 Flutter

Flutter SDK有多个分支,如beta、dev、master、stable,其中stable分支为稳定分支(日后有新的稳定版本发布后可能也会有新的稳定分支,如1.0.0),dev和master为开发分支,安装flutter后,运行flutter channel查看所有分支,结果如下:


带"*"号的分支即你本地的Flutter SDK 跟踪的分支,要切换分支,可以使用flutter channel beta 或 flutter channel master,Flutter官方建议跟踪稳定分支,但你也可以跟踪master分支,这样可以查看最新的变化,但这样稳定性要低的多。
升级Flutter SDK和依赖包,使用flutter upgrade
该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包(不包括Flutter SDK),可以使用如下命令:
flutter packages get 获取项目所有的依赖包。
flutter packages upgrade 获取项目所有依赖包的最新版本。

5、 IDE配置与使用

1、Android Studio 安装Flutter和Dart插件

Preferences => Plugins => search Flutter和Dart点击install,再配置Flutter的path。



6、创建并运行Demo

创建flutter工程有两种方式,一种直接命令创建;另一种就是通过可视化IDE来创建。下面介绍第一种。

  • 创建的命令
flutter create flutter_demo //创建一个Java和OC的项目
flutter create -i swift -a kotlin flutter_demo //创建一个kotlin和swift的项目
  • 运行到模拟器上
flutter run -d all --enable-software-rendering

注意:一定要加--enable-software-rendering,要不会很慢很慢。


运行成功

基本上环境配置就完成了,自己动手试试吧~~~

知识快车

1、Dart 语言学习,待续~。
2、Dart 语言官网Dart 编程语言概览

相关文章

网友评论

      本文标题:Flutter环境搭建(二)

      本文链接:https://www.haomeiwen.com/subject/eatbmhtx.html