近幾天工作比較閑,就看了下最近很火的Flutter,看完之后瞬間感覺很強(qiáng)大,心癢的不行,就去搗鼓了一番,中間也踩了不少坑,也參考了很多文章,終于配置好了T_T,這里面就總結(jié)一下問題吧智亮。
一、介紹
Flutter是谷歌的移動(dòng)UI框架黍瞧,可以快速在iOS和Android上構(gòu)建高質(zhì)量的原生用戶界面噪珊。 Flutter可以與現(xiàn)有的代碼一起工作钉迷。在全世界庐完,F(xiàn)lutter正在被越來越多的開發(fā)者和組織使用裆蒸,并且Flutter是完全免費(fèi)琼讽、開源的必峰。
二、安裝Flutter
- 配置鏡像地址
vim ~/.bash_profile 打開或者創(chuàng)建用來配置環(huán)境變量
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
- 下載Flutter
我不建議在官方下載安裝包,手動(dòng)下了幾次都都問題,推薦使用git
官網(wǎng)地址: Flutter中文網(wǎng)钻蹬。
git clone -b beta https://github.com/flutter/flutter.git
- 配置flutter
在.bash_profile添加如下字段吼蚁,
pwd
/flutter是你的flutter路徑
export PATH=`pwd`/flutter/bin:$PATH
三、運(yùn)行Flutter
如果是通過終端(git)安裝的,那么當(dāng)前就是Flutter目錄,先運(yùn)行:
flutter doctor
因?yàn)槲抑饔脁code 主要看iOS錯(cuò)誤(前提是安裝好xcode以及配置好模擬器)
vscode只要安裝了就沒什么大問題脉让。
網(wǎng)上常見的錯(cuò)誤:
brew未安裝或者未識(shí)別:
- brew install --HEAD libimobiledevice
- brew install ideviceinstaller
- cocoapods未安裝
還有其它brew問題,終端中的錯(cuò)誤都有提示,一步步安裝就好,忘了截圖了...
我的brew其實(shí)已經(jīng)安裝了,只是環(huán)境變量出了問題少配置一個(gè),會(huì)出現(xiàn)這個(gè)錯(cuò)誤:
Warning: /usr/local/bin is not in your PATH,只要在.bash_profile中加入一句話OK:
export PATH=/usr/local/bin:$PATH
現(xiàn)在重新在flutter目錄下運(yùn)行 flutter doctor,除了Android,都沒問題了,可以嘗試去寫一個(gè)flutter應(yīng)用了~
四桂敛、vscode示例
打開vscode安裝兩個(gè)插件:
dart code
flutter
安裝好這兩個(gè)插件后,在vscode創(chuàng)建flutter項(xiàng)目(shift+command+p)
等待幾秒...
從官方copy過來的代碼,運(yùn)行我沒找到快捷鍵,可能是我vscode配置有點(diǎn)問題,我在終端中演示:
cd到你創(chuàng)建的flutter目錄執(zhí)行:
flutter run
如果用的是模擬器的話都能直接跑起來,但是用真機(jī)調(diào)試的話要先用xocde打開這個(gè)項(xiàng)目,配置后你的App ID后,才能使用指令運(yùn)行。
終端運(yùn)行:
r的話就是熱重載了,改完代碼后保存,在終端輸入r就能看到明顯變化,q的話就是重啟生效溅潜。
放一張模擬器運(yùn)行效果圖:
如果沒有運(yùn)行過xcode的話,就用命令打開模擬器吧:
open -a Simulator
初次安裝使用就到這里了,如有錯(cuò)誤請(qǐng)指正,flutter官網(wǎng)有很詳細(xì)的文檔,慢慢學(xué)習(xí)吧~