二:Flutter 環境搭建?
1: 操作系統的選擇?
很多人會問,學習Flutter到底使用什么操作系統呢?
- 學習階段:Windows或者macOS都是可以的
- 開發階段:一般需要使用macOS,因為我們需要針對iOS進行測試、通常方便起見選擇macOS
- 疑問?如果以后做Flutter開發沒有macOS怎么辦?
這個完全放心、使用flutter開發的公司必然會給你配備macOS、Flutter可以在windows上學習、也可以在macOS上學習、因為之后調試需要在Android和iOS上進行、所以我當前使用的環境是macOS.
2: 安裝Flutter SDK
2.1: 下載Flutter 的SDK
來到flutter的官網網站、選擇最新的穩定的flutter SDK版本
- 網站地址:https://flutter.dev/docs/development/tools/sdk/releases?tab=macos
- 選擇自己的操作系統和最新穩定的版本(stable版本)(目前最新的版本是1.9.1)
2.2: 安裝Flutter
1: 解壓下載好的flutter SDK
- 這個在windows和macOS都是一樣的(選擇一個自己想要安裝的目前),但是在macOS上我一般將flutter目錄拖入到應用程序中、將其當作我的一個應用(個人習慣而已)
2: 配置flutter 的環境變量
- 因為我們之后需要在命令執行flutter 命令,所以需要配置環境變量。
macOS或者linux系統,需要編輯~/.bash_profile文件export PATH=$PATH:/Applications/flutter/bin
Windows用戶將所在路徑添加到環境變量的Path下
- windows環境變量修改:點擊計算機圖標-> 屬性 -> 高級系統設置 -> 高級 -> 環境變量
找到Path,在其中添加Flutter SDK目錄下bin目錄
在終端下執行flutter --version,出現如下內容、表示flutter安裝成功。
圖片.png
2.3: 配置鏡像
flutter 項目會依賴一些東西,在國內下載這些依賴會有一些慢,所以我們可以將它們的安裝源切換成國內的(也就是設置國內的鏡像)
macOS或者Linux操作系統,依然是編輯~/.bash_profile文件export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
windows用戶還是需要修改環境變量
- window環境變量修改:點擊計算機圖標 -> 屬性 -> 高級系統設置 -> 高級 -> 環境變量
- 新建變量 FLUTTER_STORAGE_BASE_URL, 其值為https://storage.flutter-io.cn
??:此鏡像為臨時鏡像、并不能保證一直可用,大家可以參數詳情請參考: Using Flutter in China以獲得有關鏡像服務器的最新鮮動態。
3: 配置iOS環境
如果想要為flutter配置iOS開發環境、需要在我們電腦上安裝一個Xcode
- Xcode是蘋果公司的iOS和macOS的IDE、進行過iOS開發的工程師應該非常熟悉。
3.1: 如何安裝Xcode呢?常見的有兩種
1: 直接在App Store上搜索Xcode、找到安裝即可
- 這種安裝方式有一個缺點、安裝的一定是最新的版本的(當然用最新的版本是最好的)
- 但是最新Xcode會對macOS系統有一定的要求、所以可能還要升級到對應的系統
- 如果不希望升級系統、可以選擇第二種方式。
2: 第二種方式是安裝自己想要的Xcode的版本,需要手動去下載:
- 進入地址:https://developer.apple.com/download/more頁面
- 登錄自己的Apple ID
- 在搜索框輸入Xcode、回車搜索、找到各種版本Xcode下載即可.
打開安裝好的Xcode、可能打開速度比較慢、不著急、慢慢來。
3.2: 選擇自己想用的iOS模擬器
打開Xcode、右上角點擊Xcode -> Open Developer Tools -Simulator
這個時候會打開一個默認的iOS模擬器、也可以在Hardware - > Device - 系統版本中選擇自己想要測試的模擬器,這時候我們就可以看到如下模擬器了
- 這時候我們執行一下flutter doctor,看到iOS Device Connected??了
4: 配置Android 環境
如果想要為flutter配置Android開發環境、需要在我們的電腦上安裝一個Android Studio
- Android Studio 是基于Intellij IDEA的、Google 官網的Android 應用集成開發環境(IDE)
4.1: Android Studio 下載
- 官網地址: https://developer.android.google.cn/studio
- 安裝直接雙擊安裝即可
或者4.2.1: 命令行下載Android Studio:推薦
- 下載android studio: brew cask install android-studio
- 下載Android stodio之前需要jdk: ava -version, 去官網下載java8即可
- 安裝andorid SDK: brew cask install android-sdk
4.2: Android的環境配置
打開Android Studio、會問我們是否需要設置代理、這是因為下載Android SDK等在國內不好下載
- 至于如何設置代理、這里不做講解, 下載Andorid SDK不好下載、建議使用命令行下載、快捷。
- 最好要設置代理、不然下載Android SDK很坑
- 之后各種下一步、就會幫我們安裝sdk等相關需要使用的內容
- 安裝好了、點擊Finish即可
4.3: 創建Andorid模擬器
安裝好后、我們就可以去創建模擬器:選擇 -> Configure -> AVD Manager -> Create Virtual Device -> 選擇你想用的設備、選擇Android版本(這里我沒有選擇Q版本,它目前還是一個beta版本)、點擊download
- 下一個界面、點擊accept -next就可以了
- 接著下一步、給自己的模擬器起一個名字
- 啟動Android模擬器
這時候我們執行一下Flutter doctor、看到Android Device Connected ??
!] Android Studio (version 3.5)
? Flutter plugin not installed; this adds Flutter specific functionality.
? Dart plugin not installed; this adds Dart specific functionality.
- 打開Andorid studio -> 偏好設置 -> 按圖搜索安裝Flutter 和 Dart即可
- 重啟Android Studio
圖片.png錯誤注意:[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
! Some Android licenses not accepted. To resolve this, run: flutter doctor
--android-licenses
解決:終端:flutter doctor --android-licenses
- 一路y
最后再次執行flutter doctor、ok了??。
圖片.png
5: 開發工具的選擇?
官網推薦兩個工具來開發Flutter:Android and VSCode、我們選擇哪一個呢?
對于有選擇恐懼癥的人來說、還真不是特別好選擇、所以下面我會分別說出它們的優缺點、選擇全在你。
最后我也會推薦我的選擇
5.1: VSCode優缺點?
VSCode是我們最近非常流行的開發工具、并且非常好用
而且VScode最近已經取代WebStorm作為前端首選開發工具的趨勢了。VSCode優點:
- VSCode其實并不能稱為一個IDE、它只是一個編輯器而已。
- 所以它非常的輕量級、不會占用你非常大的內存消耗、而且啟動速度等都非常快、對于電腦配置不是特別很好的開發者來說、肯定是一個非常好的選擇。
- 并且你可以在VSCode上安裝各種各樣的插件來滿足自己的開發需求。
VSCode缺點:
- 很多Android studio包括的方便操作沒有,比如點擊啟動、熱更新點擊等;
- 而且在某些情況下會出現一些問題;
- 比如之前我在使用的過程中、有時候熱更新不及時常常看到效果、必須重啟;
- 比如某些情況下、沒有代碼提示不夠靈敏。
VSCode使用須知:
使用VSCode開發Flutter我們需要安裝兩個插件:Dart和Flutter
5.2: Android Studio優缺點
對于進行過Android開發或者使用過WebStorm、IDEA、PHPStorm等開發者來說、使用Android studio肯定是沒有什么問題的。
Android Studio 優點:
-集成開發環境(IDE)不用多說、你需需的功能基本都有
-而且上面說的VSCode存在的問題、在Android Studio上基本不會出現Android Studio 缺點:
- 一個字:重
- 無論項目IDE本身、還是使用Android Studio啟動項目、都會相對慢一些
- 占據的計算機資源也很多、所以電腦配置較低時會出現卡頓。
Android Studio使用須知:
使用Android Studio開發Flutter 我們需要安裝兩個插件:Flutter 和 Dart
我的選擇
其實在兩個之間到底如何選擇對于開發者學習flutter更好,我也是糾結了很久。
- 在學習Dart語言的時候、我選擇了VSCode、因為它可以直接創建一個dart文件讓我們去學習
- 在學習flutter過程中、我選擇Android Studio、因為各種集成使用起來更加方便(繼續使用VSCode也是沒什么問題的,看個人喜歡吧)
六:其他操作
1: 版本回退:http://www.lxweimin.com/p/231d141ac8c4
2: 下載vscode:brew cask install visual-studio-code
3: 如果發生錯誤:
http://www.lxweimin.com/p/eb782589be82
ideviceinfo returned an error:
ERROR: Could not connect to lockdownd, error code -8
brew update
brew uninstall --ignore-dependencies libimobiledevice
brew uninstall --ignore-dependencies usbmuxd
brew install --HEAD usbmuxd
brew unlink usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
4: 報錯2:
http://www.lxweimin.com/p/49f0d6da734d
More than one device connected; please specify a device with the '-d <deviceId>' flag, oruse '-d all' to act on all devices.
此時如果你要選擇模擬器運行你應該輸入如下命令:
flutter run -d 6F2F0D31-9EDF-43EF-AC8D-558FC52D9EC4