(ios,Android,Xcode,Android Studio,VScode,IDEA)
1）安裝Flutter SDK
2）iOS 環(huán)境配置
3）Android Studio配置
4）VS code 配置
5）IntelliJ IDEA 配置 Flutter
正文
Flutter是谷歌的移動(dòng)UI框架，可以快速在iOS和Android上構(gòu)建高質(zhì)量的原生用戶界面。 Flutter可以與現(xiàn)有的代碼一起工作。在全世界，F(xiàn)lutter正在被越來(lái)越多的開(kāi)發(fā)者和組織使用，并且Flutter是完全免費(fèi)、開(kāi)源的。
這里我就詳細(xì)介紹一下 Flutter 在mac 上的環(huán)境部署以及開(kāi)發(fā)準(zhǔn)備。Flutter 是為了跨平臺(tái)而生的，所以為了驗(yàn)證在iOS和Android 的運(yùn)行情況，必須先在mac 上配置好 iOS 的開(kāi)發(fā)環(huán)境 Xcode 和 Android 的開(kāi)發(fā)環(huán)境 Android Studio。這里我就不在展開(kāi)寫 Xcode 和 Android Studio 的安裝配置過(guò)程了，這算是開(kāi)發(fā)Flutter 的前提條件吧。另外，我個(gè)人更喜歡IntelliJ IDEA 的Flutter 開(kāi)發(fā)環(huán)境，所以，也將IDEA 的配置Flutter方法放在最后。
所以本文流程就是先Flutter SDK
然后 Xcode 和 Android Studio
最后是IDE：VS code 和 IntelliJ IDEA
1）安裝Flutter SDK
安裝方法：
這里使用的是git安裝
//1.終端中輸入以下指令克隆項(xiàng)目
git clone -b beta https://github.com/flutter/flutter.git
//2. 導(dǎo)出到Flutter保存路徑
export PATH=`pwd`/flutter/bin:$PATH
由于國(guó)內(nèi)網(wǎng)絡(luò)限制我們可以通過(guò)修改鏡像地址來(lái)解決, 好在Google良心,專門給我們大陸提供了方案, 終端中一次輸入以下命令即可解決。
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
git clone -b dev https://github.com/flutter/flutter.git
export PATH="$PWD/flutter/bin:$PATH"
cd ./flutter
flutter doctor
關(guān)于flutter doctor
flutter doctor 是 flutter 對(duì)mac本機(jī)的環(huán)境配置診斷腳本，腳本結(jié)果會(huì)直接放出 flutter 環(huán)境有哪些需要繼續(xù)配置的。按照提示執(zhí)行腳本即可。
下面是我的flutter 診斷結(jié)果
caobo:flutter caobo56$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[?] Flutter (Channel dev, v0.10.2, on Mac OS X 10.14 18A391, locale zh-Hans-CN)
[?] Android toolchain - develop for Android devices (Android SDK 28.0.3)
[!] iOS toolchain - develop for iOS devices (Xcode 10.1)
? libimobiledevice and ideviceinstaller are not installed. To install, run:
brew install --HEAD libimobiledevice
brew install ideviceinstaller
[?] Android Studio (version 3.2)
[?] VS Code (version 1.28.2)
[!] Connected device
! No devices available
2）iOS 環(huán)境配置
正常情況下，如果沒(méi)有安裝Xcode，一般會(huì)先讓你安裝Xcode，并且一般要求最新版，但我的已經(jīng)裝了，此步略
按照 flutter doctor 提示： iOS toolchain 配置有問(wèn)題，并且給出了解決方案：
[!] iOS toolchain - develop for iOS devices (Xcode 10.1)
? libimobiledevice and ideviceinstaller are not installed. To install, run:
brew install --HEAD libimobiledevice
brew install ideviceinstaller
這里需要說(shuō)明的是，libimobiledevice 是調(diào)用iOS模擬器的一個(gè)第三方庫(kù)，flutter 使用這個(gè)庫(kù)調(diào)用iOS模擬器運(yùn)行project，十分重要。
這里依次執(zhí)行安裝腳本即可。
brew install --HEAD libimobiledevice
brew install ideviceinstaller
我在安裝的過(guò)程中，libimobiledevice 的安裝遇到了一個(gè)問(wèn)題：
brew install --HEAD libimobiledevice
==> Cloning [https://git.libimobiledevice.org/libimobiledevice.git](https://git.libimobiledevice.org/libimobiledevice.git) Updating /Users/rjoiner/Library/Caches/Homebrew/libimobiledevice--git
==> Checking out branch master Already on 'master' Your branch is up to date with 'origin/master'. HEAD is now at b34e343 tools: Remove length check on device UDID arguments to support newer devices
==> ./autogen.sh Last 15 lines from /Users/rjoiner/Library/Logs/Homebrew/libimobiledevice/01.autogen.sh: checking dynamic linker characteristics... darwin16.7.0 dyld checking how to hardcode library paths into programs... immediate checking for pkg-config... /usr/local/opt/pkg-config/bin/pkg-config
checking pkg-config is at least version 0.9.0... yes checking for libusbmuxd >= 1.1.0... no configure: error: Package requirements (libusbmuxd >= 1.1.0) were not met:
Requested 'libusbmuxd >= 1.1.0' but version of libusbmuxd is 1.0.10
仔細(xì)看最后一行，我們會(huì)發(fā)現(xiàn)異常所在Requested 'libusbmuxd >= 1.1.0' but version of libusbmuxd is 1.0.10，很顯然是由于系統(tǒng)要求的 libusbmuxd 版本和所要安裝的版本不一致。
經(jīng)過(guò)一番搜索終于找到了問(wèn)題所在:
A recent change to libimobiledevice bumped the constraint on libusbmuxd to >= version 1.1.0. The current usbmuxd homebrew package is version 1.0.10.
As a result, homebrew --HEAD installs of libimobiledevice no longer build without a --HEAD install of usbmuxd.
Until the usbmuxd homebrew formula is updated, a workaround is to install it at HEAD:
總之就是libimobiledevice更新了，我們可以通過(guò)下面的方式安裝libimobiledevice:
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
其中，usbmuxd如果安裝有問(wèn)題，可以嘗試直接 unlink/link usbmuxd,然后再執(zhí)行 brew install --HEAD libimobiledevice 即可。我的就是這樣解決了。
caobo:flutter caobo56$ brew install --HEAD libimobiledevice
Updating Homebrew...
==> Auto-updated Homebrew!
Updated 1 tap (homebrew/cask).
No changes to formulae.
==> Cloning https://git.libimobiledevice.org/libimobiledevice.git
Updating /Users/caobo/Library/Caches/Homebrew/libimobiledevice--git
==> Checking out branch master
Already on 'master'
Your branch is up to date with 'origin/master'.
HEAD is now at 92c5462 idevicebackup2: Fix scan_directory() for platforms not having d_type in struct dirent
==> ./autogen.sh
==> ./configure --disable-silent-rules --prefix=/usr/local/Cellar/libimobiledevice/HEAD-92c5462_3 --without-cython -
==> make install
?? /usr/local/Cellar/libimobiledevice/HEAD-92c5462_3: 67 files, 1MB, built in 58 seconds
最終，再次執(zhí)行flutter doctor
caobo:flutter caobo56$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[?] Flutter (Channel dev, v0.10.2, on Mac OS X 10.14 18A391, locale zh-Hans-CN)
[?] Android toolchain - develop for Android devices (Android SDK 28.0.3)
[?] iOS toolchain - develop for iOS devices (Xcode 10.1)
[?] Android Studio (version 3.2)
[?] VS Code (version 1.28.2)
[?] Connected device (2 available)
? No issues found!
3）Android Studio配置
Android Studio的配置非常簡(jiǎn)單：
- 打開(kāi)Android Studio -> Preference > Plugins
- 在搜索框中搜索 Flutter
- 本地沒(méi)有, 就聯(lián)網(wǎng)查找,搜索到Flutter, 點(diǎn)擊安裝即可
- Dart環(huán)境他自動(dòng)會(huì)安裝好
如果Flutter安裝失敗，請(qǐng)不要灰心，這主要是網(wǎng)絡(luò)問(wèn)題，調(diào)整配置或者開(kāi)VPN即可。（能使用Android Studio，網(wǎng)絡(luò)問(wèn)題肯定已經(jīng)得到了很好的解決）
4）VS code 配置
VS code的Flutter配置也很簡(jiǎn)單：
- 打開(kāi)VS code -> Extentions管理
- 在搜索框中搜索 Flutter
- 搜索到Flutter, 點(diǎn)擊安裝即可
-
Dart環(huán)境也是自動(dòng)會(huì)安裝好
屏幕快照 2018-11-09 上午7.29.34.png
配置完成后，按照提示，重啟VS code 就生效了。此時(shí)，可以按照提示，去執(zhí)行Flutter doctor來(lái)檢查 VS code 的配置情況。
VS code 中創(chuàng)建Flutter 項(xiàng)目
然后就可以在VS code 中創(chuàng)建Flutter 項(xiàng)目了。
-
打開(kāi)VS code -> View -> Command Palette...
屏幕快照 2018-11-09 上午7.38.30 -
在命令行框中輸入 Flutter，然后找到Flutter: new project,然后Enter
屏幕快照 2018-11-09 上午7.38.42 -
然后輸入 project Name
屏幕快照 2018-11-09 上午7.39.09 -
根據(jù)提示，選擇項(xiàng)目創(chuàng)建位置，項(xiàng)目就創(chuàng)建完成了
屏幕快照 2018-11-09 上午7.39.38
屏幕快照 2018-11-09 上午7.40.08
5）IntelliJ IDEA 配置 Flutter
- 打開(kāi)IntelliJ IDEA -> Preference > Plugins
- 在搜索框中搜索 Flutter
- 搜索到Flutter, 點(diǎn)擊安裝即可
- Dart環(huán)境他自動(dòng)會(huì)安裝好
這樣，IntelliJ IDEA 的 Flutter 開(kāi)發(fā)環(huán)境就配置好了，但是現(xiàn)在我們還不能直接在IDEA 中創(chuàng)建 Flutter 項(xiàng)目，因?yàn)樾枰枰~外安裝配置Dart語(yǔ)言的開(kāi)發(fā)環(huán)境。
Mac安裝Dart的SDK
需要注意的是，flutter是基于Dart語(yǔ)言開(kāi)發(fā)的，所以我們需要額外安裝配置Dart語(yǔ)言的開(kāi)發(fā)環(huán)境。
本機(jī)是使用brew(Homebrew)安裝Dart，如果你的mac未安裝這個(gè)軟件管理插件，請(qǐng)先安裝Homebrew。
1、直接打開(kāi)終端 依次執(zhí)行：
$ brew tap dart-lang/dart
$ brew install dart
2、查看相關(guān)信息：
$ brew info dart
執(zhí)行結(jié)果如下：
caobo:flutter caobo56$ brew info dart
dart-lang/dart/dart: stable 2.0.0, devel 2.1.0-dev.9.3
The Dart SDK
https://www.dartlang.org/
/usr/local/Cellar/dart/2.0.0 (1,220 files, 374.3MB) *
Built from source on 2018-11-08 at 19:26:05
From: https://github.com/dart-lang/homebrew-dart/blob/master/dart.rb
==> Options
--devel
Install development version 2.1.0-dev.9.3
==> Caveats
Please note the path to the Dart SDK:
/usr/local/opt/dart/libexec
安裝完成后，注意安裝的路徑，在使用IntelliJ IDEA創(chuàng)建 Dart項(xiàng)目時(shí)需要Dart SDK的path
其中，/usr/local/opt/dart/libexec 就是Dart的安裝環(huán)境。
然后就可以創(chuàng)建 Flutter 項(xiàng)目了。
