前言:
各位同學(xué)大家好 在flutter 官網(wǎng)也有環(huán)境搭建的教程 号杠，我現(xiàn)在最近在學(xué)習(xí)flutter屁桑，所以就按照自己的安裝過程 整理一下環(huán)境搭建的整個(gè)流程 分享給大家
一 準(zhǔn)備工作:
1帆谍、升級(jí) Macos 系統(tǒng)為最新系統(tǒng)
2饼酿、安裝最新的 Xcode
3运准、電腦上面需要安裝 brew https://brew.sh/
二吭敢、下載 Flutter碰凶、配置 Flutter 環(huán)境變量、配置 Flutter 鏡像
1鹿驼、下載 Flutter SDK
https://flutter.dev/docs/development/tools/sdk/releases?tab=macos
2欲低、把下載好的 Flutter SDK 隨便減壓到你想安裝 Sdk 的目錄如
/Users/aisheng/flutter_mac/flutte
3、把 Flutter 安裝目錄的 bin 目錄配置到環(huán)境變量畜晰，然后把 Flutter 國(guó)內(nèi)鏡像也配置到環(huán)境 變量里面
vim ~/.bash_profile
export PATH=/Users/aishengwanwu/flutter_mac/flutter/bin:$PATH export
PUB_HOSTED_URL=https://pub.flutter-io.cn export
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
source ~/.bash_profile
flutter -h 如果能出來一些命令說明 flutter sdk 配置成功砾莱。
注意如果配置完成后輸入 flutter -h 告訴你 flutter 不是內(nèi)置命令之類的錯(cuò)誤的話，可能 sdk 沒有配置成功凄鼻，也可能 sdk 下載的時(shí)候沒有下載全
三腊瑟、運(yùn)行 flutter doctor 命令檢測(cè)環(huán)境
第一次運(yùn)行 flutter doctor 的時(shí)候會(huì)提示下面錯(cuò)誤
? 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
? 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.dev/platform-plugins
To install:
brew install cocoapods pod setup
四、 配置 Flutter Ios 環(huán)境
1块蚌、如果電腦上面沒有安裝 brew 的話首先第一步需要安裝
brew https://brew.sh/
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
2闰非、分別執(zhí)行下面命令
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
brew update
brew install --HEAD usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setup
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
brew update
brew install --HEAD usbmuxd
brew link usbmuxd
brew install ideviceinstaller ios-deploy cocoapods
pod setup
注意：
如果運(yùn)行命令失敗請(qǐng)運(yùn)行 brew doctor 并按照說明解決問題。
執(zhí)行完成上面命令后然后重新運(yùn)行：
flutter doctor 如果出來下圖表示 ios 的環(huán)境配置完成
五峭范、命令行工具生成 Flutter 項(xiàng)目
sudo flutter create flutterdemo
六财松、修改 Flutter Sdk 目錄的權(quán)限以及項(xiàng)目的 權(quán)限
七、Xcode 打開 flutter 項(xiàng)目 模擬器運(yùn)行項(xiàng) 目
注意：打開項(xiàng)目之前一定要修改權(quán)限
八虎敦、在 Vscode 中配置 開發(fā) Flutter 項(xiàng)目
1游岳、Vscode 中安裝 Flutter 插件 Dart 插件。
2其徙、Vscode 中打開 flutter 項(xiàng)目進(jìn)行開發(fā)
3胚迫、運(yùn)行 Flutter 項(xiàng)目
flutter run
各種快捷鍵
r 鍵：點(diǎn)擊后熱加載，也就算是重新加載吧唾那。
p 鍵：顯示網(wǎng)格访锻，這個(gè)可以很好的掌握布局情況，工作中很有用闹获。
o 鍵：切換 android 和 ios 的預(yù)覽模式期犬。
q 鍵：退出調(diào)試預(yù)覽模式。
最后總結(jié):
我也是個(gè)初學(xué) flutter 的新手 個(gè)人覺得dart語言和flutter 混編UI框架 對(duì)于有原生開發(fā)經(jīng)驗(yàn)的同學(xué)還是比較容易上手 避诽，有興趣學(xué)的的同學(xué)可以私下多多交流 龟虎，如果覺得文章還不錯(cuò)麻煩給個(gè)star 和轉(zhuǎn)發(fā) 謝謝 （個(gè)人qq/微信：1693891473）
QQ 交流群:
