Flutter 安裝
今天偶然看到一個公眾號寫了一篇關于Flutter 的文章, 感覺挺好, 所以就來嘗試一下, 整個安裝過程挺簡單, 但也不是特別順利, 因為我自己使用的是Mac系統所以這里所有操作都是Mac系統下的操作
安裝Flutter SDK
編寫你的第一個 Flutter App 這篇文章有SDK和編輯器的下載方式,
我這里推薦使用git下載
//1.終端中輸入以下指令克隆項目
git clone -b beta https://github.com/flutter/flutter.git
//2. 導出到Flutter保存路徑
export PATH=`pwd`/flutter/bin:$PATH
由于國內網絡限制我們可以通過修改鏡像地址來解決, 好在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
flutter doctor 檢測環境執行結果如下
[?] Flutter (Channel beta, v0.5.1, on Mac OS X 10.13.5 17F77, locale zh-Hans-CN)
[?] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[!] iOS toolchain - develop for iOS devices (Xcode 9.4.1)
? libimobiledevice and ideviceinstaller are not installed. To install, run:
brew install --HEAD libimobiledevice
brew install ideviceinstaller
[?] Android Studio (version 3.1)
[!] IntelliJ IDEA Ultimate Edition (version 2018.1.1)
? Flutter plugin not installed; this adds Flutter specific functionality.
? Dart plugin not installed; this adds Dart specific functionality.
[!] VS Code (version 1.24.1)
[?] Connected devices (1 available)
! Doctor found issues in 3 categories.
第一個對勾是說我的Flutter安裝沒問題
第二個對勾是說我的安卓工具也OK
第三行是說iOS工具沒安裝好, 具體就是需要安裝他提供的兩個庫 按照他的說法終端執行如下操作
brew install --HEAD libimobiledevice
brew install ideviceinstaller
注意上面這兩個東西第一次沒安裝成功就是因為我網絡的原因, 有可能你第一次執行完 flutter doctor 就不會報這個錯, 對于網絡原因的話我建議大家去
完事之后再執行 flutter doctor, 這一項就會變成對勾
第四個對勾是說我的Android Studio中Flutter插件已經安裝, 如果沒有安裝提示和第五個 [!] 內容提示一樣
[!] Android Studio IDEA Ultimate Edition (version 2018.1.1)
? Flutter plugin not installed; this adds Flutter specific functionality.
? Dart plugin not installed; this adds Dart specific functionality.
解決方案就是打開Android Studio -> Preference > Plugins 在搜索框中搜索 Flutter, 本地沒有, 就聯網查找,搜索到Flutter, 點擊安裝即可 Dart環境他自動會安裝好, IntelliJ 的操作是一模一樣的這里不再贅述
第五個是 VS code 編輯器, 這個里面直接搜索插件Flutter安裝即可
第六個是我鏈接的一臺設備
全部搞定運行 flutter doctor 結果如下
Doctor summary (to see all details, run flutter doctor -v):
[?] Flutter (Channel beta, v0.5.1, on Mac OS X 10.13.5 17F77, locale zh-Hans-CN)
[?] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[?] iOS toolchain - develop for iOS devices (Xcode 9.4.1)
[?] Android Studio (version 3.1)
[?] IntelliJ IDEA Ultimate Edition (version 2018.1.1)
[!] VS Code (version 1.24.1)
[?] Connected devices (2 available)
看到以上結果就可以高高興興的開發了.
創建第一個Flutter Demo
打開 Android Studio 新建一個Flutter項目 如下圖所示
第二步選擇 一個項目模板 Flutter Application
如下圖, Flutter SDK path 一定要填寫正確, 如果你上面操作和我一樣, 用git克隆的, 那么位置就在/Users/youUserName/flutter , youUserName就是你的電腦用戶名, 正確填寫即可.
打開項目如果有手機運行APP到手機上, 瞬間開心死了, 一套代碼兩個平臺簡直美死了,
接下來就是要好好學習dart語法了
