tags: Flutter、install、MacOS

Flutter 安裝 feat. Apple M3 Pro

Flutter SDK

硬體需求

請先確認安裝的硬體需求，設備太低階，開發會想哭…(過來人心聲)

Step1. 下載 SDK

到 Flutter SDK archive 根據電腦晶片選擇對應的版本，以筆者電腦為例，MacOS M3 Pro，選擇最新的 Stable channel (macOS) 中的 arm64 版本下載。

Step2. 解壓縮 SDK 至新創建的 development 資料夾

$mkdir -p ~/development/

# 檔名的版本需改成當前下載的為主，此以 flutter_macos_arm64_3.22.0-stable 為例
# unzip ~/Downloads/<your_flutter_version>.zip \
#     -d ~/development/

$unzip ~/Downloads/flutter_macos_arm64_3.22.0-stable.zip \
     -d ~/development/

Step3. 設定 zsh 的 Flutter Path

$vi ~/.zshenv

輸入 i 進入 insert 模式，在檔案中貼上下面這段：

export PATH=$HOME/development/flutter/bin:$PATH

再按 esc，輸入 wq 存檔離開後，重開啟 Terminal。

Step4. 檢查是否安裝成功

$flutter doctor

失敗的話就是 zsh: command not found: flutter，需要再檢查一下上面步驟是否有正確：

成功的話，會有 log flutter 相關資訊：
（Welcome 只有初次會被 log 出來，沒看到也不用緊張，正常後面都會跟著 Doctor summary…，確定有的話，安裝就是沒問題）

$flutter doctor

$flutter doctor -v

Step5. 安裝 Rosetta

Flutter 部分組件並不支援直接跑在 Apple silicon 上，需要另外安裝 rosetta 2 解決：

$sudo softwareupdate --install-rosetta --agree-to-license

Step6. 新增一個 Flutter 專案

$flutter create first_project

$cd first_project

$flutter run

可以選擇 [2]: Chrome (chrome) 後，可以開啟以下畫面，想開發 Web 的話或想先練習 Dart、基礎 Flutter 語法練習或切版，安裝設定到這步，就可以直接進開發了～

VSCode Extension

在 Extension 搜尋 Flutter，選擇第一個安裝：

Android 開發環境

Step1. 安裝 Android Studio

下載和安裝最新的 Android Studio 版本，如果沒特別需求，安裝時都選擇 Next 按鈕和標準安裝即可。

Step2. 設定 SDK Manager

點選 More Actions 後，選擇 SDK Manager，檢查 Flutter 要求的 components（版本會更新，依照當下官網為主） 是否都有被安裝：

• Android SDK Platform, API 34.0.5
• Android SDK Command-line Tools
• Android SDK Build-Tools
• Android SDK Platform-Tools
• Android Emulator

如果沒有記得打勾，按 Apply 後會自動安裝。

可以在輸入 flutter doctor -v 檢查，可以看到 Android Studio 那區塊已經都是綠色點點了～

Step3. 設定 Android Emulator

點選 More Actions 後，選擇 Virtual Device Manager 後，可以看到畫面，預設已經有一個 Device 了，如果想新增裝置可以按左上角 + 的按鈕。

點選右邊 ▶，就可以開啟 Emulator ～


Step4. 同意 SDK package licenses

執行 flutter doctor -v 或 flutter run 都會看到下面的警告：

Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses

只要輸入這行指令，並同意全部的 SDK package licenses 即可：

$flutter doctor --android-licenses

再使用 flutter doctor 檢查，Android 相關的都是綠色點點了！

$flutter doctor -v

iOS 開發環境

Step1. 安裝 Xcode

到 App Store 下載 Xcode，並開啟跑安裝流程。

Step2. 設定 Xcode

初始化設定 command-line tools 使用 Xcode 安裝的版本

$sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'

並同意 Xcode license

$sudo xcodebuild -license

Step3. 安裝 CocoaPods

$brew install cocoapods