为什么要用Flutter?

嗯,本篇文章不会讲,因为我认为想看这篇文章的应该已经下定决心要学习Flutter。

Flutter开发环境支持安装在Windows、Mac OS和Linux下,区别在于Windows和Linux并不能直接通过虚拟机来调试IOS下是否运行正常,而Mac是可以的。

本篇文章主要讲述在Mac下配置下踩到的坑,和对应的一些解决方式,我碰到的这些问题你也不一定会碰到,同样遇到需要可以帮到你....

Windows环境很简单,按照官网提示,基本不会有什么问题,没有Linux环境,所以就不说了,可以参考Mac的配置,会比mac少一些配置。

下面就开始吧......


一、环境工具的准备

首先你的电脑环境先准备好以下工具:

  • Git:

官网:https://git-scm.com/

直接下载安装好就可以了,安装好以后可以打开终端,输入"git --version"来检查是否安装成功;

  • JDK

推荐JDK1.8或者更高版本,下载安装自行去安装、配置,同样可以通过在终端输入“java version”来检查是否安装成功。

  • Android SDK

这个你可以跟着IDE的向导来一起下载需要的SDK,也可以提前准备好,这个搞过Android开发的应该都有吧?

  • IDE

IDE是集成开发环境,可以使用VisualStudio code或者Android Studio来进行开发,VS code更轻量,我更习惯使用Android Studio来进行开发。无论你使用哪款IDE,需要你安装Flutter和Dart的插件,在IDE的插件管理器搜索Flutter安装即可,一般Flutter的安装会自动安装好Dart插件。


二、Flutter SDK的配置

  • Flutter SDK下载地址:
https://flutter.dev/docs/development/tools/sdk/releases?tab=macos#macos

打开以后是这样:

349b5235f9c777665a64bad346588781.png

你可以通过标签来切换你的操作系统环境来下载对应的SDK,推荐下载Stable channel,这是稳定版的SDK,想尝鲜的话也可以去下载Dev channel的SDK。

下载的是个压缩包,自己找个位置放一下, 将flutter文件下的bin文件夹加到系统Path变量中。

配置好以后就可以终端输入“flutter doctor”命令来检查Flutter环境是否配置完毕,配置的细节可以按照官网的指导来执行。

官方文档:https://flutter.dev/docs/get-started/install中文文档:https://flutterchina.club/get-started/install/

基本的配置就说到这里吧,有搞不定的可以留言。。。

下面我们针对Mac环境下面配置的一些问题来说一下。


三、Mac环境下的麻烦事

Mac环境的配置主要是在HomebrewCocoapods的环境配置上卡了很久,主要是没有梯子....也实在没有找到便宜又实惠的梯子,谁有的话留言推荐一个,感谢!

没有梯子,那只能曲线救国了.......

  • 第一次Flutter Doctor........
f9d0c81f784a48692cba1885752b6521.png

按照提示我运行了“brew update”,然后就是无尽的等待、失败........

只好先解决Homebrew的问题....

没有天梯,只能想办法使用国内可用的镜像,首先,打开终端:

curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install >> brew_install

这行命令是获取官方的安装脚本把他重命名为“brew_install”文档保存在终端执行目录。

然后使用终端vi命令或者自己熟悉的编辑器打开这个文件,找到如下代码:

BREW_REPO = “https://github.com/Homebrew/brew“.freeze CORE_TAP_REPO = “https://github.com/Homebrew/homebrew-core“.freeze

修改为:

BREW_REPO = “https://mirrors.ustc.edu.cn/brew.git “.freeze CORE_TAP_REPO = “https://mirrors.ustc.edu.cn/homebrew-core.git“.freeze

主要目的是替换官方源为清华大学的镜像源,需要注意的是新版本HomeBrew可能没有CORE_TAP_REPO这句代码,如果没有不用新增。 如果这个镜像有问题的话,可以换成其他源(自己去查查其他可以用的国内源),记得保存关闭。

然后打开终端,执行这个我们修改过的安装脚本:

/usr/bin/ruby brew_install

如果在运行过程中出现了:

==> Tapping homebrew/coreCloning into '/usr/local/Homebrew/Library/Taps/homebrew/homebrew-core'...

出现这个原因是因为源不通,代码拉不下来,解决方法就是更换国内其他镜像源吗,手动执行下面这句命令,更换为中科院的镜像:

git clone git://mirrors.ustc.edu.cn/homebrew-core.git/ /usr/local/Homebrew/Library/Taps/homebrew/homebrew-core --depth=1

然后把homebrew-core的镜像地址也设为中科院的国内镜像:

cd "$(brew --repo)"git remote set-url origin https://mirrors.ustc.edu.cn/brew.gitcd "$(brew --repo)/Library/Taps/homebrew/homebrew-core"git remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git

执行更新,成功:

brew update

最后用这个命令检查无错误:

brew doctor  

至此HomeBrew就算是安装完成了.......我是折腾了很久o(╥﹏╥)o

直接使用HomeBrew还需要更改他的默认源.....还有.....

  • 替换核心软件仓库
cd "$(brew --repo)/Library/Taps/homebrew/homebrew-core"git remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git  
  • 替换 cask 软件仓库(提供 macOS 应用和大型二进制文件)
cd "$(brew --repo)"/Library/Taps/caskroom/homebrew-caskgit remote set-url origin https://mirrors.ustc.edu.cn/homebrew-cask.git   
  • 替换 Bottles 源(Homebrew 预编译二进制软件包)

bash(系统默认shell)端用户:

echo 'export HOMEBREW_BOTTLE_DOMAIN=https://mirrors.ustc.edu.cn/homebrew-bottles' >> ~/.bash_profilesource ~/.bash_profile

zsh终端用户:

echo 'export HOMEBREW_BOTTLE_DOMAIN=https://mirrors.ustc.edu.cn/homebrew-bottles' >> ~/.zshrcsource ~/.zshrc
  • 第二次Flutter Doctor........
9c2a4e8951c3e59d2c107423157d459d.png

因为我们前面已经配置好了Homebrew的环境,执行前面3个命令都顺利执行,但是到红色箭头指向的代码运行就又出问题了:

2b366b3bb28d934b199a0067c3c9dda5.png

这一堆提示就是告诉我,代码它拉不下来...拉不下来....拉不下来....

继续搞吧....把它提示的git clone 代码复制出来,就是这一段:

git clone --branch master https://git.libimobiledevice.org/libimobiledevice.git /Users/liupp/Library/Caches/Homebrew/libimobiledevice--git

修改为:

git clone --branch master https://github.com/libimobiledevice/libimobiledevice.git /Users/liupp/Library/Caches/Homebrew/libimobiledevice--git

直接终端执行修改后的命令,执行结束后终端切换到这个目录下(别问我为什么找不到liupp目录,这个是我的用户,别忘了换成你的用户目录名称....):

cd /Users/liupp/Library/Caches/Homebrew/libimobiledevice--git

执行:

./autogen.sh

然后又出现了....

4b66bef827e15e9a297182e183d04108.png

换个命令执行:

./autogen.sh --disable-openssl

好吧,这个时候错误提示变了,告诉我缺少组件了,总算前进了一步:

e88d330aa83ece21617e586fd07d1fd0.png

执行:

brew install gnutls

安装完毕提示:

For compilers to find libffi you may need to set: export LDFLAGS="-L/usr/local/opt/libffi/lib" For pkg-config to find libffi you may need to set: export PKG_CONFIG_PATH="/usr/local/opt/libffi/lib/pkgconfig"   ==> unbound To have launchd start unbound now and restart at startup: sudo brew services start unbound

按提示依次执行:

044637ccf05ea9de0057de42d1eb873a.png

执行结果提示:

fbb2d7cb40ee3394a308f40793754072.png

重新执行:

./autogen.sh --disable-openssl

又报错(崩溃ing....)

1410e179fcd581535ca144efa5725a3f.png

需要安装libgcrypt库:

brew install libgcrypt

安装完毕后重新执行:

./autogen.sh --disable-openssl

终于:

b7deb15ff7b5b0928868aaae1509d6d2.png

按提示:

make

执行成功后继续执行:

sudo make install

执行:

export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:/usr/local/lib

安装:

brew install ideviceinstaller
第三次Flutter Doctor........

安装成功后再检查Flutter环境:

e365d2b0e2c7a83755ef927350cce246.png

继续执行:

brew install ios-deploy
第四次Flutter Doctor........

安装完毕重新检查:

1c9c46a7a0cb7545c438de6a1eb4800c.png

终于只剩下最后一个了......

执行:

brew install cocoapods

然后噩梦就又开始了....归根揭底终究还是没有梯子的问题,由于有了处理HomeBrew的经验,这次就轻车熟路了。

Cocoapods

CocoaPods 是一个 Cocoa 和 Cocoa Touch 框架的依赖管理器,具体原理和 Homebrew 有点类似,都是从 GitHub 下载索引,然后根据索引下载依赖的源代码。

对于旧版的 CocoaPods 可以使用如下方法使用 tuna 的镜像:

$ pod repo remove master$ pod repo add master https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git$ pod repo update

新版的 CocoaPods 不允许用pod repo add直接添加master库了,但是依然可以:

cd ~/.cocoapods/repos $ pod repo remove master $ git clone https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git master

最后进入自己的工程,在自己工程的podFile第一行加上:

source 'https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git'

以后如果想重置为官方Github源的话,可以如下操作:

cd ~/.cocoapods/repospod repo remove mastergit clone https://github.com/CocoaPods/Specs master# 最后进入自己的工程,在自己工程的podFile第一行加上sources 'https://github.com/CocoaPods/Specs'
第N次Flutter Doctor........

终于,各项都变成了绿色对号......


四、结语

遇到的各种不痛快,更多原因还是因为网络的问题,没有梯子,很多站的代码确实没有办法拉下来,或者获取速度真的慢到让人牙痒痒。不过见山开山,问题最后都解决了,心里还是有些许的成就感,哈哈。。

如果有遇到其他环境配置问题的朋友,可以留言一起探讨、学习!

建议多看看官方文档还是有很大帮助的,尾巴再贴一下地址,翻到这里不用回头去找了,哈哈:

官方文档:https://flutter.dev/docs/get-started/install中文文档:https://flutterchina.club/get-started/install/
Logo

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐