開始構建 Flutter macOS 原生桌面應用
軟體要求
#要編寫和編譯桌面版的 Flutter 程式碼,請安裝以下軟體包。
作業系統
#Flutter 支援在 macOS 12 (Monterey) 或更高版本上開發。本指南假定您的 Mac 執行 zsh 作為您的 預設 Shell。
一些 Flutter 元件需要 Rosetta 2 翻譯過程。如果你在 Apple Silicon (ARM) Mac 上進行開發,請安裝 Rosetta 2
sudo softwareupdate --install-rosetta --agree-to-license開發工具
#下載並安裝以下軟體包。
- Xcode 用於除錯和編譯原生的 Swift 或 Objective-C 程式碼。Xcode 的安裝還包括 Git,用於管理 Flutter 版本和您自己的原始碼版本控制。
- CocoaPods 用於編譯 Flutter 外掛並在您的原生應用中啟用它們。
上述軟體的開發者提供這些產品的支援。要解決安裝問題,請查閱該產品的文件。
文字編輯器或整合開發環境
#你可以使用任何文字編輯器或整合開發環境 (IDE) 結合 Flutter 的命令列工具來構建應用。
使用帶有 Flutter 擴充套件或外掛的 IDE 可提供程式碼補全、語法高亮、小部件編輯輔助、除錯及其他功能。
流行的選項包括
- 安裝 Visual Studio Code 並安裝 VS Code 的 Flutter 擴充套件。
- 安裝包含 IntelliJ 版 Flutter 外掛的 Android Studio。
- IntelliJ IDEA,同時安裝 IntelliJ 的 Flutter 外掛 和 IntelliJ 的 Android 外掛。
安裝 Flutter SDK
#要安裝 Flutter SDK,你可以使用 VS Code Flutter 擴充套件,或自行下載並安裝 Flutter 包。
使用 VS Code 安裝 Flutter
#要按照這些說明安裝 Flutter,請驗證您已安裝 Visual Studio Code 和 VS Code 版 Flutter 擴充套件。
提示 VS Code 安裝 Flutter
#啟動 VS Code。
要開啟命令面板,請按 Command + Shift + P。
在命令面板中,輸入
flutter。選擇Flutter: 新建專案。
VS Code 會提示你定位電腦上的 Flutter SDK。
如果你已安裝 Flutter SDK,請點選定位 SDK。
如果你未安裝 Flutter SDK,請點選下載 SDK。
如果您尚未按照開發工具先決條件中的說明安裝 Git,此選項會將您帶到 Flutter 安裝頁面。
當提示哪個 Flutter 模板?時,請忽略。按 Esc。你可以在檢查開發環境設定後建立一個測試專案。
下載 Flutter SDK
#當顯示選擇 Flutter SDK 資料夾對話方塊時,選擇你想要安裝 Flutter 的位置。
VS Code 會首先將你定位到使用者配置檔案目錄。請選擇其他位置。
考慮使用
~/development/點選克隆 Flutter。
下載 Flutter 時,VS Code 會顯示以下彈窗通知:
Downloading the Flutter SDK. This may take a few minutes.Initializing the Flutter SDK. This may take a few minutes.下載和安裝需要幾分鐘。如果你懷疑下載已卡住,請點選取消,然後重新開始安裝。
Flutter 安裝成功後,VS Code 會顯示此彈窗通知:
Do you want to add the Flutter SDK to PATH so it's accessible in external terminals?點選新增 SDK 到 PATH。
成功時,會顯示通知
The Flutter SDK was added to your PATHVS Code 可能會顯示 Google Analytics 通知。
如果你同意,點選確定。
在所有終端視窗中啟用
flutter- 關閉,然後重新開啟所有終端視窗。
- 重新啟動 VS Code。
下載然後安裝 Flutter
#要安裝 Flutter,請從其存檔下載 Flutter SDK 包,將該包移動到你希望儲存的位置,然後解壓 SDK。
下載以下安裝包以獲取 Flutter SDK 的最新穩定版本。
對於其他釋出渠道和舊版本,請查閱 SDK 存檔。
Flutter SDK 應下載到 macOS 預設下載目錄:
~/Downloads/。建立一個你可以安裝 Flutter 的資料夾。
考慮在
~/development/建立一個目錄。將檔案解壓到你希望儲存 Flutter SDK 的目錄中。
unzip ~/Downloads/flutter_sdk_v1.0.0.zip \ -d ~/development/完成後,Flutter SDK 應位於
~/development/flutter目錄中。
將 Flutter 新增到您的 PATH
#要在終端中執行 Flutter 命令,請將 Flutter 新增到 PATH 環境變數中。本指南假定你的 Mac 執行的是最新的預設 shell,即 zsh。Zsh 使用 .zshenv 檔案來設定 環境變數。
啟動您偏好的文字編輯器。
如果存在,請在您的文字編輯器中開啟 Zsh 環境變數檔案
~/.zshenv。如果不存在,請建立~/.zshenv。複製以下行並將其貼上到您的
~/.zshenv檔案末尾。bashexport PATH=$HOME/development/flutter/bin:$PATH儲存您的
~/.zshenv檔案。要應用此更改,請重新啟動所有開啟的終端會話。
如果您使用其他 Shell,請查閱此關於設定 PATH 的教程。
配置 iOS 開發
#安裝和配置 Xcode
#要開發桌面版的 Flutter 應用,請安裝 Xcode 以編譯為原生位元組碼。
開啟 App Store 並登入。
搜尋
Xcode。點選安裝。
Xcode 安裝程式佔用 6 GB 以上的儲存空間。下載可能需要一些時間。
要配置命令列工具以使用已安裝的 Xcode 版本,請使用以下命令。
sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'請使用此路徑獲取最新版本的 Xcode。如果您需要使用其他版本,請指定該路徑。
簽署 Xcode 許可協議。
sudo xcodebuild -license
儘量保持使用最新版本的 Xcode。
安裝 CocoaPods
#如果您的應用依賴於具有原生桌面程式碼的 Flutter 外掛,請安裝 CocoaPods。此程式會聚合 Flutter 和桌面程式碼的各種依賴項。
要安裝和設定 CocoaPods,請執行以下命令:
按照 CocoaPods 安裝指南安裝
cocoapods。sudo gem install cocoapods啟動您偏好的文字編輯器。
在文字編輯器中開啟 Zsh 環境變數檔案
~/.zshenv。複製以下行並將其貼上到您的
~/.zshenv檔案末尾。bashexport PATH=$HOME/.gem/bin:$PATH儲存您的
~/.zshenv檔案。要應用此更改,請重新啟動所有開啟的終端會話。
檢查開發環境設定
#執行 Flutter doctor
#flutter doctor 命令驗證 macOS 完整 Flutter 開發環境的所有元件。
開啟您的終端。
要驗證所有元件的安裝,請執行以下命令。
flutter doctor
由於你選擇進行桌面開發,所以不需要所有元件。如果你按照本指南進行操作,該命令應該會為你設定的工具和平臺輸出 [✓]。
Flutter doctor 問題排查
#當 flutter doctor 命令返回錯誤時,可能與 Flutter、VS Code、Xcode、已連線裝置或網路資源有關。
如果 flutter doctor 命令針對這些元件中的任何一個返回錯誤,請使用詳細模式標誌再次執行它。
flutter doctor -v檢查輸出,看是否需要安裝其他軟體或執行其他任務。
如果你更改了 Flutter SDK 或其相關元件的配置,請再次執行 flutter doctor 來驗證安裝。
使用 Flutter 開始開發 macOS 桌面應用
#恭喜。 成功安裝所有必需項和 Flutter SDK 後,您就可以開始為 macOS 桌面開發 Flutter 應用了。
要繼續你的學習之旅,請查閱以下指南:
管理 Flutter SDK
#要了解更多關於管理 Flutter SDK 安裝的資訊,請查閱以下資源: