# Flutter 安裝教學 --- ## 必需安裝的東西 * Flutter SDK * IDE * Android SDK --- ## Flutter SDK ##### 各版本下載網址 : https://docs.flutter.dev/release/archive ##### 官方安裝教學 : https://docs.flutter.dev/get-started/install ---- ## Windows 系統 ---- ### 下載 找到Stable channel,選取Windows,點選下載最新的Flutter Stable Version ![image](https://hackmd.io/_uploads/B1-KRVPc1e.png) ---- ### 解壓縮 * 解壓縮下載的zip檔 (可以下載 7-Zip 以提升解壓縮速度) * 解壓縮目錄注意 : * 避免路徑包含特殊字元或空格。 * 避免需要許可權的路徑。 ---- ### 環境變數設定 * 打開電腦`設定`>>`系統資訊`>>`進階系統設定` * 點選`進階`>>`環境變數` * 在系統變數中編輯PATH * 添加Flutter的bin目錄路徑 ---- 開啟PowerShell,輸入`flutter --version`,如果顯示資訊則代表安裝成功。 ![image](https://hackmd.io/_uploads/HJLbQBw9kx.png) ---- ## MacOS 系統 ---- 找到Stable channel,選取MacOS,點選對應型號、最新的Flutter Stable Version ![image](https://hackmd.io/_uploads/Sk3Uab591x.png) ---- (請確認你的shell為zsh) * 創建一個可以安裝 Flutter 的資料夾。 * 將壓縮檔解壓到要存儲 Flutter SDK 的目錄中。 * 請在文本編輯器中打開 Zsh 環境變數檔 ~/.zshenv。如果沒有,請創建 ~/.zshenv。 * 請複製以下命令並將其粘貼到 ~/.zshenv 檔的末尾並存檔。 ``` export PATH=$HOME/<路徑>/flutter/bin:$PATH ``` --- ## IDE 設置 ---- Flutter 官網推薦了三款 IDE : * Visual Studio Code,雖然vscode不是IDE(https://code.visualstudio.com/Download) * Android Studio (https://developer.android.com/studio) * InteliJ JDEA(完整版須付費,但可以使用學生版) --- ## Android SDK ---- * 載點 : https://developer.android.com/studio * 安裝完成之後,打開Settings,點選`File >> Settings >> Languages & Frameworks >> Android SDK`,設置Android SDK Location。 * 以上完成後到,檢查以下是否都有安裝 : - **Android SDK Command-line Tools** - **Android SDK Platform-Tools** - **Android Emulator** ---- * 打開PowerShell,執行(先使用flutter doctor查看狀態) * (`flutter config --android-sdk <sdk目錄位置>`) * `flutter doctor --android-licenses` * 以上完成後執行`flutter doctor`檢視安裝狀態 * 完成應該會顯示 : ![image](https://hackmd.io/_uploads/ByjvdBPqye.png) --- ## Flutter 命令工具 ---- #### 開發環境 命令|描述|範例 -|-|- doctor|檢查 Flutter 環境是否正確安裝|`flutter doctor` upgrade |升級 Flutter SDK 至最新版本|`flutter upgrade` config |設定 Flutter 配置|`flutter config --build-dir=<DIRECTORY>` ---- #### 項目管理 命令|描述|範例 -|-|- create|建立新的 Flutter 專案|`flutter create my_app` clean|清除專案的暫存檔案|`flutter clean` analyze|分析程式碼是否有錯誤或警告|`flutter analyze` ---- #### 項目管理 - 依賴處理 pub 命令|描述|範例 -|-|- get|下載依賴項目|`flutter pub get` add|增加依賴項目|`flutter pub add <package_name>` upgrade|更新依賴項目|`flutter pub upgrade` outdated|檢查哪些依賴項目可以更新|`flutter pub outdated` ---- #### 應用執行與測試 命令 |描述 |範例 -|-|- run |執行應用程式 |`flutter run` run -d chrome|在 Chrome 瀏覽器上運行 (Web) |`flutter run -d chrome` run -d windows|在 Windows 上運行 (桌面應用)|`flutter run -d windows` ---- 命令 |描述 |範例 -|-|- run --release|以 release 模式執行 (最佳化效能)|`flutter run --release` run --debug|以 debug 模式執行|`flutter run --debug` test |執行所有測試|`flutter test` test <DIRECTORY>|執行特定測試檔案|`flutter test <DIRECTORY>` ---- #### 構建 Build 命令 |描述 |範例 -|-|- apk |生成 Android .apk 檔案 |`flutter build apk` ios |生成 iOS 應用 (需 macOS)|`flutter build ios` web|生成 Web 應用|`flutter build web` ---- #### 設備管理 命令 |描述 |範例 -|-|- flutter devices |列出可用的設備 |flutter devices flutter emulators |列出已安裝的 Android 模擬器 |flutter emulators flutter screenshot|從連接的設備擷取Flutter應用的螢幕截圖|flutter screenshot
{"title":"Flutter 安裝教學","description":"Flutter SDK","contributors":"[{\"id\":\"6d6e3ba2-6820-4c6f-9117-f09bccc7f7aa\",\"add\":3114,\"del\":0}]"}
    402 views
   owned this note