[Flutter 學習筆記] Mac 環境設置 (1)

前提概要

最近剛好有個小東西想做需要寫 App，在 2018 年知道了 Flutter 這個 Google 出的號稱可以橫跨 IOS 跟 Android 的 Framework 後，曾經有下載下來寫了個 Hello World!。

最近打算認真學習這 Framework，目前是計畫主要透過這個 Udemy 的課程來學習來減少學習時間。

Flutter 安裝

有幾個步驟我們要依序完成：

1. 安裝 Flutter SDK
2. 安裝 Android SDK 或 Xcode（我自己目前是安裝 Android）
3. 把 Android 的 emulator 設定好，這樣我們才以辦法知道我們寫的程式執行起來長怎樣

1. 安裝 Flutter SDK

那我們先到官網 Flutter macOS install 下載（我自己下載的是 flutter_macos_1.20.2-stable.zip 這個版版本）。如圖：

接著就是記得要設定 path ，path 的路徑會是上面解壓縮的那個資料夾 ，然後執行

$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 1.20.2, on Mac OS X ...)

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[✗] Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS development.
      Download at: https://developer.apple.com/xcode/download/
      Or install Xcode via the App Store.
      Once installed, run:
        sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
        sudo xcodebuild -runFirstLaunch
    ✗ CocoaPods not installed.
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To install:
        sudo gem install cocoapods
[!] Android Studio (version 4.0)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[✓] IntelliJ IDEA Ultimate Edition (version 2020.1.1)
[!] VS Code (version 1.40.2)
    ✗ Flutter extension not installed; install from
      https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter
[!] Connected device
    ! No devices available

! Doctor found issues in 4 categories.

2. 安裝 Android SDK

• 我是利用 IntelliJ IDEA 安裝 SDK，安裝方式很簡單，就是 new 一個 Android 的 project，然後如果原本沒安裝的話他就會問我們要不要安裝，直接安裝即可。

• 因為我本身是用 IntelliJ 開發，所以需安裝 dart 的 plugin，安裝方式就是進到 Plugins 裡面的 Marketplace 安裝。如圖：

教學中有這段 cmd，我沒注意就下了，看起來是跟 license 有關
$ flutter doctor --android-licenses  //  Run the Android SDK manager tool to accept the SDK's licenses

3. 這定 Android 的 emulator

首先裝好 Android Studio 以後，我們進到畫面右下方的 AVD Manager

然後我們就可以新增我們自己的虛擬裝置了

都裝好後，之後就可以看到一個手機的畫面（就是 Android 模擬器）在螢幕上了。