開發flutter項目 搭建工具環境
flutter項目本身 所需開發工具環境
flutter 谷歌公司開發 系統支持庫 鏡像庫
搭建流程:
flutter 官網:
https://flutter.dev/community/china
//步驟1 .bash_profile
touch .bash_profile
pwd
/Users/haijunyan
open ~
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
//步驟2 獲取Flutter SDK
https://docs.flutter.dev/release/archive
mac OS Stable channel (macOS) 3106
flutter_macos_3.10.6-stable.zip
(支持)系統flutter底層文件夾(安裝包)至目標目錄
/Users/haijunyan/Documents
/Users/haijunyan/Documents/flutter
系統flutter底層文件夾(安裝包)的訪問路徑配置至全局變量配置文件
export PATH=/Users/haijunyan/Documents/flutter/bin:$PATH
//FlutterSDK 支持開發環境檢驗
flutter doctor
交互式腳本(命令行交互區)
報錯:zsh: command not found: flutter
Mac 默認采用 zsh交互式腳本(命令行交互區) 作為 登錄Shell /交互式Shell
解決方案一:手動切換至bash交互式腳本(命令行交互區)
source ~/.bash_profile // source /Users/haijunyan/.bash_profile
flutter doctor
解決方案二:
pwd // /Users/haijunyan
cd /Users/haijunyan/
open ~/.zshrc
vim ~/.zshrc //新建文件(若提示文件不存在)
open ~/.bash_profile
把bash_profile中的內容copy到zshrc文件中(全局變量配置)
source ~/.zshrc //再資源載入source命令重新加載
終端退出重啟 flutter doctor
AndroidStudio Google公司提供的兼容性輔助工具 可構建出android/ios/window/macos/linux等兼容各個方向的運行包
AndroidStudio (version 最新Mac)
右上角 更多
Apply > OK
flutter doctor --android-licenses //y
AndroidStudio 兼容性工具平臺的配置
.bash_profile
Xcode 專業輔助構建出iOS運行包
依托于flutter項目 產生的app應用包
創建基(本)層的flutter項目
cd /Users/haijunyan/Desktop/CustomKit/TeamGroupSimulation/FlutterDemo/
source /Users/haijunyan/.bash_profile 或 source ~/.bash_profile
flutter create 項目文件夾名稱
運行基層的flutter項目
切換至flutter項目對應的文件夾路徑下
cd 相對路徑 //cd fltapp
正式運行基層的flutter項目
flutter run //命令行運行(手動關聯模擬器或手機設備)
brew -v //判斷是否安裝Homebrew環境
brew update //brew環境更新至最新版本
//安裝輔助插件(flutter項目 iOS包 運行iOS真機)
xcode-select --install //Xcode 相關 工具命令行
//安裝 ipa包(通過命令碼實現(需要預配置好開源庫插件環境)(不推薦))
brew cleanup
brew install --HEAD usbmuxd
Error: libusbmuxd 2.0.2 is already installed
brew unlink libusbmuxd
brew install --HEAD usbmuxd //brew update --auto-update
brew link usbmuxd
brew install --HEAD libimobiledevice
brew unlink imobiledevice
brew install --HEAD imobiledevice //強調分支下載
brew install libimobiledevice //不強調分支(基于tag下載)
brew link libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods
pod setup
//安裝 lipa包(通過輔助工具實現(itools/iTunes/Xcode等工具平臺)(推薦))
brew doctor
切換至二方庫flutter項目本身的路徑目錄文件夾下
cd /Users/haijunyan/Desktop/FlutterDemo/fltapp
pwd
/Users/haijunyan/Desktop/FlutterDemo/fltapp
open ios/Runner.xcworkspace //ios方向workspace運行研究(默認打開Xcode的workspace編輯模式)
AndroidStudio 兼容性工具平臺(推薦(自動關聯))
左 模擬器
右 真機
熱重載r 更改的部分刷新 維持狀態
熱重啟R 全部刷新 全部刷新重啟
二方庫flutter項目 通過模擬器運行自動熱重載(實時更新(調試推薦))
二方庫flutter項目 通過真機運行需要手動熱重載(手動更新(調試不推薦))
備注:
flutter 業務層面 lib 業務 源碼資源
二方庫 flutter 項目(本身) pubspec 庫本身配置文件
iOS 宿主層面 (iOS體系(iPhone iPod iWatch iPad ITV))
android宿主層面(Android體系(安卓手機 安卓手環(表) 安卓平板 安卓電視 安卓GoogleChrome瀏覽器 ))
macos宿主層面 Mac電腦端原生項目產生電腦.dmp產品包(mac電腦設備)
windows宿主層面 window電腦端原生項目產生電腦.exe產品包(window電腦設備)
linux宿主層面 linux電腦端原生項目產生電腦產品包(linux電腦設備)
二方庫flutter本身源碼+xxx(iOS/macos/Android/windows/linux)原生項目(包)
基于硬件的待渲染載體設備觸發對應的xxx原生項目(包)
flutter運行流程之iOS方向 關鍵要素2次中轉
Xcode工具平臺 iOS方向產品包 對應iOS(真機/模擬器)設備 運行視覺流程效果
AndroidStudio工具平臺 兼容型各方向的產品包 對應各種兼容性(真機/模擬器)設備 運行視覺流程效果
二方庫flutter項目通過中轉式運行后最終實際產生的目標程序為原生移動端iOS(Xcode工具平臺)/Android(AndroidStudio工具平臺)產品包
keg 文件夾
formulae 法則/手段
brew 基層管理環境(管理上層插件) //通過brew環境下載插件的過程非常緩慢(大概率斷開失效,不斷重新連接網絡重新下載)
1.輔助工具實現安裝 ipa(推薦)
2.命令碼實現安裝 ipa(不推薦)
libimobiledevice 本質是開源庫 (—HEAD/—MASTER …強調各種分支branch)
pod --version
輔助工具AndroidStudio工具平臺編輯模式:可開發Android原生項目產生安卓.apk產品包
二方庫flutter項目本身層面自有文件的變更通過AndroidStudio工具平臺
AndroidStudio工具平臺:兼容型原生項目層文件的變更+flutter項目層自有文件的變更
Xcode工具平臺:原生iOS項目層文件的變更
AndroidStudio工具平臺:兼容各種原生項目(不同運行平臺的項目框架(器))
原生項目包(通常比較干凈)即項目框架(器)(承載體作用)內被注入的資源通常為業務需求資源(lib文件夾內的業務源碼主文件資源(即lib文件夾內進行flutter源碼開發))
haijunyan 15.7.3(版本高) iPhone7Plus
真機調試:
舉例:iPhoneYHJ 12.5.7 iPhone5s
cd /Users/haijunyan/Desktop/FlutterDemo/fltapp
open ios/Runner.xcworkspace
備注:
iOS真機調試:
AndroidStudio工具平臺+Xcode工具平臺
1.flutter項目首次:AndroidStudio工具平臺設備運行>Xcode工具平臺團隊簽名配置預安裝>關閉退出Xcode工具平臺>AndroidStudio工具平臺設備運行安裝真機調試
2.flutter項目非首次:AndroidStudio工具平臺設備運行安裝真機調試
android安卓真機調試:
AndroidStudio工具平臺
1.flutter項目:AndroidStudio工具平臺設備運行安裝真機調試
mac和iphone數據線連接斷續閃爍
解決方案:
終端Terminal輸入sudo killall -STOP -c usbd回車
進程關閉 sudo killall -STOP -c usbd
安卓開發者官網:
http://developer.android.com/studio //國境外(VPN)
https://developer.android.com/studio#downloads
https://developer.android.com/studio/run/emulator-acceleration.html
https://developer.android.com/studio/run/emulator-acceleration.html#vm-mac //mac使用的加速器插件(境外)
https://developer.android.google.cn/studio //國境內鏡像下載站
https://developer.android.google.cn/studio/intro?hl=zh-cn //AndroidStudio官方說明文檔
安卓模擬器 處于 AndroidStudio 自有的Dock欄區(window窗口)
source ~/.bash_profile
emulator -list-avds //列出AndroidStudio工具相關的android模擬器設備插件
emulator -avd Nexus_6P_API_29 //啟動AndroidStudio工具相關的android模擬器
emulator -avd Pixel_2_API_29
安卓真機數據線連接(默認調試):
華為榮耀50NTHAN00手機設備(榮耀50開發者模式:設置>關于手機>版本號 多次連續點擊>開發者模式)
設置>系統和更新>開發人員選項>USB調試 打開>終端source ~/.bash_profile > 終端flutter devices(驗證flutter項目是否識別真機) >
1.AndroidStudio工具平臺調試: 運行flutter項目
2.終端調試:
cd /Users/haijunyan/Desktop/FlutterDemo/fltapp
pwd
/Users/haijunyan/Desktop/FlutterDemo/fltapp
flutter run -d ‘設備名稱’ //運行flutter項目
安卓真機無線連接調試WLAN(WIFI無線調試)(比較慢/受到Wi-Fi網絡質量影響):
設置>系統和更新>開發人員選項>USB調試 打開>無線調試>使用二維碼配對設備>已配對的設備>無線調試
二方庫flutter項目引入其他三方開源包Package:
舉例:english_words三方開源包
1.打開flutter項目目錄下 pubspec.yaml 文件
2.dependencies新增english_words配置
english_words三方開源包
english_words: ^3.1.0
3.flutter pub get 開源包相關數據資源拖入項目中
4.english_words: ^4.0.0 三方開源包采用最新版本
5.flutter pub upgrade 重新更新 三方開源包
6.重新啟動模擬器
flutter/dart相關輔助插件的安裝:
AndroidStudio工具平臺 右上角賬號旁邊設置圖標 Plugins Plugins Flutter plugin 搜索輔助插件 install OK
側邊欄(目錄)項目面板
二方庫 插件項目 整體對外 插件感
sudo killall -STOP -c usbd
buzhidao