欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Mac上flutter的环境搭建

程序员文章站 2024-03-22 23:44:16
...

一、安装flutter SDK

1、按照官网说明,获取flutter SDK

如图下载其最新可用的安装包 https://flutter.dev/docs/get-started/install/macos#

Mac上flutter的环境搭建

2、下载后,将安装包解压到你要安装的目录,如图,我放在了这里

Mac上flutter的环境搭建

3、添加flutter相关工具到path

打开终端输入命令行

vim ~/.bash_profile

Mac上flutter的环境搭建

如上图,输入a,将打开编辑模式,增加一行

export PATH=`pwd`/flutter/bin:$PATH

`pwd`是你flutter的安装目录,同时将环境变量添加到文件中

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
输入完成,按esc,然后输入:wq退出编辑,在终端输入
source ~/.bash_profile
这个意思是让配置文件在修改后立即生效

二、检查开发环境

1、flutter需要依赖xcode和Android Studio的支持,终端运行flutter doctor 执行命令查看安装情况

flutter doctor

 2、一般报错的话,就是xcode或者Android Studio过低,或者缺少Android SDK等,xcode版本过低或者cocoapods版本过低的情况,升级下即可,我们下面主要解决Android报错信息,如下图:

Mac上flutter的环境搭建

3、上图报错信息缺少Android SDK,下载Android Studio并安装到应用程序,在执行flutter doctor会提示以下信息

Mac上flutter的环境搭建

4、打开Android Studio,点击右下角设置按钮,选择SDK Manager,切到SDK Tools下,勾掉底部hide obsolete packages选项,然后将Android SDK Tools(obsol)选上,点击底部apply,执行结束,点OK

Mac上flutter的环境搭建

Mac上flutter的环境搭建

5、重新回到终端执行flutter doctor,提示以下信息

Mac上flutter的环境搭建

按照提示执行命令,系统会询问很多权限,输入y回车,执行结束后,重新执行flutter doctor,你会惊喜的发现,这一项报错没有了

flutter doctor --android-licenses

6、执行flutter doctor,还剩两个问题,那就是flutter和dart插件问题

Mac上flutter的环境搭建

打开Android Studio,点击屏幕左上角的Android Studio,选择prefrrences...,在plugins中选择Marketplace,分别搜索flutter和ddart插件,如果网不好的话,可能需要多搜几遍才能出来,然后点击右边的install按钮,下载插件

Mac上flutter的环境搭建

Mac上flutter的环境搭建

插件下载后,后边的install会变成revert字样,点击按钮,Android Studio会重启,这时,重新执行flutter doctor,你会发现所有的报错都没了

Mac上flutter的环境搭建

7、创建一个flutter应用

Mac上flutter的环境搭建

那么,接下来开始你的flutter之旅吧!