文:毛毛,版权归属https://maomao.ink,转载请注明出处!
《Flutter零基础入门》,从无到有构建Android、iOS双平台APP,更新中…
今天开始,我重新捡起之前中断的Flutter学习。在新的电脑上搭建新的环境,记录如下,希望可以帮助到你!
本文参考资料:
- 【Flutter中文网】
- 《Flutter实战》
步骤一:设置镜像
将下面两个镜像地址导入到环境变量中。
代码语言:javascript复制export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
环境变量设置步骤:
- 打开终端,输入
sudo vi ~/.bash_profile
,按回车输入密码后会打开bash_profile文件。(一定要用sudo,否则没权限保存文件。) - 在打开的vim编辑界面添加上述两行环境变量。添加步骤:按下键盘
i
进入编辑模式,编辑完成后按esc
、再输入:wq
,按下回车即可退出。如果不想保存,就输入:q
退出。
步骤二:下载Flutter SDK
- 去Flutter官网下载最新可用的安装包,官网地址:https://flutter.io/sdk-archive/#macos
- 解压sdk,将sdk目录放在合适的位置
3.设置环境变量。将flutter所在目录设置到环境变量中,以我的配置为例:
代码语言:javascript复制export PATH=~/Documents/demo/flutter_src/flutter/bin:$PATH
其中/Documents/demo/flutter_src/
是我flutter文件夹的根目录,需根据情况自行修改。
步骤三、运行flutter doctor命令
设置好环境变量以后可以在终端任何地方运行flutter doctor
命令,如未设置,需跳转到flutter所在目录运行。
运行完之后会出现诊断结果,我初次运行结果如下:
代码语言:javascript复制maomaodeMacBook-Pro:demo maomao$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.2.1, on Mac OS X 10.13.6 17G2208,
locale zh-Hans-CN)
[!] Android toolchain - develop for Android devices (Android SDK
version 28.0.3)
! Some Android licenses not accepted. To resolve this, run:
flutter doctor --android-licenses
[!] iOS toolchain - develop for iOS devices (Xcode 10.1)
✗ libimobiledevice and ideviceinstaller are not installed. To
install with Brew, run:
brew update
brew install --HEAD usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
✗ ios-deploy not installed. To install:
brew install ios-deploy
✗ Brew can be used to install tools for iOS device development.
Download brew at https://brew.sh/.
[!] Android Studio (version 3.2)
✗ Flutter plugin not installed; this adds Flutter specific
functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
[!] Connected device
! No devices available
! Doctor found issues in 4 categories.
maomaodeMacBook-Pro:demo maomao$
从诊断结果来看,我还有两个步骤没有完成。一个是Xcode配置,另一个是AndroidStudio配置,都是与Flutter相关的。如果你未安装Xcode或者AndroidStudio,应该会提示你安装。
步骤四、配置Xcode,安装 libimobiledevice 和 ideviceinstaller
网上查了一堆,发现这两个插件都是通过Homebrew命令来安装的,所以需要先安装Homebrew。Homebrew是一个Xcode的辅助工具,新安装的Xcode是不带的,需要自行安装。
Homebrew 安装步骤:
- 终端运行:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
2.按提示进行安装,运行brew
命令检查是否安装成功。
安装 libimobiledevice
代码语言:javascript复制brew install libimobiledevice
安装 ideviceinstaller
代码语言:javascript复制brew install ideviceinstaller
安装完成之后,flutter doctor
,发现报如下错误:
⣷Unhandled exception:
Exception: ideviceinfo returned an error:
ERROR: Could not connect to lockdownd, error code -8
解决办法:运行sudo chmod -R 777 /var/db/lockdown
,输入密码。
再次运行flutter doctor
,发现iOS部分还是报错如下:
iOS toolchain - develop for iOS devices
✗ Xcode installation is incomplete; a full installation is
necessary for iOS development.
Download at: https://developer.apple.com/xcode/download/
Or install Xcode via the App Store.
Once installed, run:
sudo xcode-select --switch
/Applications/Xcode.app/Contents/Developer
✗ Verify that all connected devices have been paired with this
computer in Xcode.
If all devices have been paired, libimobiledevice and
ideviceinstaller may require updating.
To update with Brew, run:
brew update
brew uninstall --ignore-dependencies libimobiledevice
brew uninstall --ignore-dependencies usbmuxd
brew install --HEAD usbmuxd
brew unlink usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
✗ ios-deploy not installed. To install:
brew install ios-deploy
✗ CocoaPods not installed.
CocoaPods is used to retrieve the iOS platform side's plugin
code that responds to your plugin usage on the Dart side.
Without resolving iOS dependencies with CocoaPods, plugins will
not work on iOS.
For more info, see https://flutter.io/platform-plugins
To install:
brew install cocoapods
pod setup
根据提示依次运行如下命令:
代码语言:javascript复制sudo xcode-select --switch
brew update
brew uninstall --ignore-dependencies libimobiledevice
brew uninstall --ignore-dependencies usbmuxd
brew install --HEAD usbmuxd
brew unlink usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setup//这段下载要很久
上面是我遇到的情况,具体诊断结果会因人而异,不管怎样,你只要照着报错下面的提示做就行了(就是run:
下面的命令)。
运行完所有上述命令,再运行flutter doctor,在iOS项里面还有如下错误: Xcode installation is incomplete; a full installation is necessary for iOS development.
[!] iOS toolchain - develop for iOS devices
✗ Xcode installation is incomplete; a full installation is necessary for iOS
development.
Download at: https://developer.apple.com/xcode/download/
Or install Xcode via the App Store.
Once installed, run:
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
这里提示说Xcode没有完全安装,我去AppStore搜Xcode,发现我的Xcode需要更新了,按提示更新完毕。如果你的Xcode是安装的最新完整版,应该会少很多问题。
安装完成之后更具提示运行命令:
代码语言:javascript复制sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
如果运行命令报错,尝试重启一下终端。
折腾完上面的步骤,iOS的报错项基本解决了。
步骤五、配置AndroidStudio,安装 Dart 和 Flutter 插件
按照下图操作步骤,安装Dart和Flutter插件。
步骤六、最后运行flutter doctor命令
完成所有步骤之后,最后运行flutter doctor
进行检查,这个命令可以随时运行检查。
maomaodeMacBook-Pro:~ maomao$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.2.1, on Mac OS X 10.13.6 17G2208, locale
zh-Hans-CN)
[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
! Some Android licenses not accepted. To resolve this, run: flutter doctor
--android-licenses
[✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
[✓] Android Studio (version 3.2)
[✓] Connected device (2 available)
! Doctor found issues in 1 category.
以上就是环境搭建的整个过程,下一篇给大家讲如何用flutter运行最简单的应用“hello world”,敬请期待!