原先一直都是在做iOS的原生開發(fā),Android也是興趣平平缚俏,曾經(jīng)也是很想學(xué)習(xí)下RN的尔崔,無(wú)奈web前端跟js的一些相關(guān)內(nèi)容實(shí)在不熟悉,直到這次的flutter的出現(xiàn) 讓我重新有股學(xué)習(xí)的沖動(dòng)摹量。so,本文比較傾向于iOS的調(diào)試馒胆,所有的內(nèi)容都是建立在對(duì)iOS原生開發(fā)比較熟悉的基礎(chǔ)上缨称。
安裝flutter
官網(wǎng)flutter.io
當(dāng)然跟著我做也一樣
安裝sdk
打開 Terminal 先cd到你需要安裝的目錄下, 我這里直接在 ~
個(gè)人目錄下
一次執(zhí)行下面幾條命令
git clone -b beta https://github.com/flutter/flutter.git
export PATH=`pwd`/flutter/bin:$PATH
flutter doctor
將flutter添加到環(huán)境變量中
vim ~/.brash_profile
//這個(gè)一定要添加
export PATH=/Users/用戶名/xxxxxx/flutter/bin:$PATH
//這個(gè)是配置Android相關(guān)的 沒(méi)有Android studio 或者 只要測(cè)試iOS的話 這幾個(gè)可以先不管
export ANDROID_HOME="/Users/用戶名/Documents/android_sdk" //android sdk目錄祝迂,替換為你自己的即可
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
執(zhí)行source ~/.brash_profile
最后檢查下echo $PATH
看看 是否已經(jīng)添加到環(huán)境變量中
flutter doctor
命令是用來(lái)檢查依賴環(huán)境
最后結(jié)果是這樣的
按照他的提示把缺少的內(nèi)容安裝一下睦尽,我這里就主要安裝iOS相關(guān)的幾樣?xùn)|西先
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
pod 大家應(yīng)該都有裝
但是在安裝上面三個(gè)東西的時(shí)候brew居然給我報(bào)錯(cuò)了
/usr/local/include is not writable.
這是什么鬼。型雳。当凡。查了很多方法
最后 解決方法 居然發(fā)現(xiàn) /usr/local/ 目錄下居然沒(méi)有include這個(gè)目錄,手動(dòng)添加一個(gè)include目錄解決>兰蟆Q亓俊!
link完成后再運(yùn)行flutter doctor
看到iOS這塊沒(méi)問(wèn)題就OK了 (Android暫時(shí)不管了)
安裝VSCode
考慮到對(duì)Android studio 不是很熟悉冤荆,所以這次選擇了 vscode
直接在官網(wǎng)下載vscode
安裝flutter插件
打開vscode
按快捷鍵 cmd + shift + p 或者 菜單欄選擇 view - command palette
輸入 install 選擇插件安裝
先安裝 flutter
的語(yǔ)言包 dart
接下來(lái)繼續(xù)安裝 flutter
插件
新建Flutter工程
打開vscode cmd + shift + p 輸入 flutter 選擇 new project
這時(shí)候可能會(huì)提示 找不到 flutter sdk
手動(dòng)導(dǎo)入下 (我是安裝在 ~目錄下直接選擇flutter目錄就可以)
輸入新建的工程名,選擇存放路徑
這時(shí)候就會(huì)自動(dòng)生成相關(guān)工程文件
這是模板工程朴则,選擇模擬器就能直接跑了
先打開模擬器 open -a Simulator
這是最下角就可以選擇剛剛打開的模擬器
點(diǎn)擊debug 直接運(yùn)行
模擬器就跑起來(lái)了,效果還不錯(cuò)~
Tips
vscode 默認(rèn)創(chuàng)建的 xcode工程是 OC版本的
如果想要?jiǎng)?chuàng)建swift 版本的話 就不能通過(guò)vscode 來(lái)創(chuàng)建
需要直接命令行創(chuàng)建
flutter create -i swift ProjectName
這時(shí)候就是用swift的工程了
kotlin 也一樣 加參數(shù)-a kotlin
就行了
今后會(huì)陸續(xù)再更新更具體的練手項(xiàng)目钓简,敬請(qǐng)期待吧~~~
我的博客即將搬運(yùn)同步至騰訊云+社區(qū)佛掖,邀請(qǐng)大家一同入駐:https://cloud.tencent.com/developer/support-plan?invite_code=3nyifx0wvqecc