笔记-Flutter开发环境搭建Mac版

009.jpg

虽然网上有很多关于Flutter开发环境配置的,但是感觉在安装过程,总是会遇到一些别人遇不到的问题,这里做个简单的总结

系统环境要求

  • MacOS (64-bit)
  • 磁盘空间:大于3G
  • 命令号工具:bash、mkdir、rm、git、curl、unzip、which、brew 这些命令在都可以使用

在配置环境前,可能会遇到一些坑,我自己两个电脑,再加上工作电脑,所以一共配置了3次环境,遇到了各种各样的坑,这里先说下配置前遇到的坑。

ls vi 等命令 command not found
原因是因为环境变量的问题,编辑profile文件没有写正确,导致在命令行下 ls等命令不能够识别。
解决办法:在命令行下打入下面这段就可以了
export PATH=/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin:/root/bin

brew命令的坑,很多mac系统都没有安装这个
学习安装brew:https://segmentfault.com/a/1190000013317511

使用oh-my-zsh 安装配置终端
当然这里只是一个建议,后面用到一些命令,单词较长,配置完成后,有利于我们更加快速的完成配置,而且终端的使用也会变得极其方便,喜欢尝试的朋友们可以去配置一下oh-my-zsh配置

下载Flutter SDK包

直接去官网下载,建议挂梯子

进去后直接点击下载就好了


image

配置环境变量

下载好以后,把下载的文件夹放进一个目录下,这个目录要记住,后面配置环境变量时,要用到。
比如:/Users/用户名/Desktop/Flutter/flutter,这里的Flutter就是我新建的文件夹,下载的文件flutter我就是放在该目录下

打开终端,进入到上面所说的目录,使用vim进行配置环境变量,命令如下

vim ~/.bash_profile

在打开的文件里增加一行代码,意思是配置flutter命令在任何地方都可以使用。

export PATH=/Users/用户名/Desktop/Flutter/flutter/bin:$PATH

这里的是根据你放置下载文件的路径来写的,所以自己要清楚路径才行。如果不能使用梯子的还需要在环境变量里配置一下Pub源,不然无法使用,可以直接接着下面增加两行配置

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

配置完成后,需要使用source命令重新加载一下,具体如下:

source ~/.bash_profile

进行到这步,就算flutter安装工作完成了,但是还是不能进行开发。可以使用命令来检测一下,是否安装成功了。

flutter -h

出现下面结果,说明到目前为止是一切顺利的。

image

这里我们可能会遇到一个问题,就是提示zsh: command not found: flutter
这说明我们上面配置flutter命令没有成功,检测一下路径是否有问题,可以cd/Users/用户名/Desktop/Flutter/flutter目录下,使用flutter -h,查看运行结果,如果失败,就检测一下路径。

如果上面路径下提示成功,在其他路径下提示不成功,那么进行下面命令:

vim ~/.zshrc

在打开的文件里最下面增加一行代码,就是配置的路径

export PATH=/Users/用户名/Desktop/Flutter/flutter/bin:$PATH

保存退出后,再使用source命令重新加载一下:

source ~/.zshrc

到这里,应该可是在任何路径下使用flutter命令了。

检查开发环境

到上面为止,我们只是安装好了Flutter,但是还不具备开发环境,使用Flutter命令进行检查:

flutter doctor
http://jspang.com/static/upload/20181031/hWspWXNesCVAZYZV0Z2iSdhb.png

image

仔细看上面的说明,我们需要一条一条的安装,知道满足开发环境。
这里可以先直接下载Xcode,Android Studio,VSCode这三个软件。
Xcode直接在App Store里下载
Android Studio下载地址:http://www.android-studio.org
VSCode下载可直接百度,网上有很多链接提供。(这里不是必须的,可下载可不下载,配置环境的时候不要求,开发时可用,毕竟轻量级)

下载Android Studio的时候,记得搭上梯子,不然可能。。。(你懂得😉)

如果Android Studio有安装的,那么第一步要做的就是允许协议(android-licenses),终端输入以下命令:

flutter doctor --android-licenses

然后后面会让你输入y/n的时候,一路y下去就行了。

完成后,再次使用flutter doctor进行检查,如下:

image

意思是我们需要安装这些软件,后面就根据它的提示,使用brew命令进行安装。

brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setup

这里每输入完一个,都需要等待一会,比较耗时,中间也有可能遇到其他情况,可以根据他的提示输入其他命令;如果在某一步卡主,可以重启终端,直接接着上一步输入命令就行(这里就遇到这个坑,以为是网速问题,卡在updating的一步,半天不动,重启一下,一会就过)

到这步了,如果有下面提示,说明我们的Android Studio需要安装一下Flutter插件:

image

使用command + ‘,’ 打开窗口,如下:

image

如果没有搜索到Flutter,可点击中间的Search in repositories
http://jspang.com/static/upload/20181031/Exnsbuo_aOB3s75oTd4r6JCE.png
image

安装完成后,重启一下Android Studio就行。

如果出现

image

没有什么问题,因为我们需要连接一个调试设备,所以才出现这个问题,连接手机,或者打开Xcode里的模拟器就解决了。

到这里,开发环境就配置完成了。这里比较麻烦,但是能征服这些问题也是很有成就感觉,而且后期在研究Flutter开发的时候,发现这点麻烦是值得的。

参考链接:技术胖的博客

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,271评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,275评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,151评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,550评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,553评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,559评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,924评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,580评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,826评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,578评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,661评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,363评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,940评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,926评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,156评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,872评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,391评论 2 342