Skip to main content

快速安裝

本頁將引導您完成 Flutter 的快速安裝流程。

了解如何使用任何基於 Code OSS 的編輯器(例如 VS Code)來設定你的 Flutter 開發環境, 並體驗 Flutter 的開發者使用流程。

如果你曾經使用過 Flutter 開發, 或者偏好使用其他編輯器或 IDE, 可以改為參照自訂安裝說明

確認你的開發平台

#

本頁的說明已設定為涵蓋在 Windows 裝置上 安裝並試用 Flutter。

如果你想參照其他作業系統的說明, 請選擇以下其中一個。

下載必要的軟體

#

為了讓 Flutter 設定過程更加順暢, 請先安裝以下工具。

  1. 設定 Linux 支援

    如果你尚未在 Chromebook 上設定 Linux 支援, 請開啟 Linux 支援

    如果你已開啟 Linux 支援, 請依照修正 Linux 問題的說明確認它是最新版本。

  2. 下載並安裝必要套件

    使用 apt-get 或你偏好的安裝方式, 安裝以下套件的最新版本:

    • curl
    • git
    • unzip
    • xz-utils
    • zip
    • libglu1-mesa

    如果你想使用 apt-get, 請以下列指令安裝這些套件:

    sudo apt-get update -y && sudo apt-get upgrade -y
    sudo apt-get install -y curl git unzip xz-utils zip libglu1-mesa
    
  3. 下載並安裝 Visual Studio Code

    若要快速安裝 Flutter,並在之後編輯和除錯你的應用程式, 請安裝並設定 Visual Studio Code

    你也可以改為安裝並使用任何其他支援 VS Code 擴充功能的 Code OSS 編輯器。 若選擇如此,在本文的其餘部分, 請將 VS Code 視為你所選擇的編輯器。

  1. 安裝 git

    如果你已安裝 git,請跳到下一步:下載並安裝 Visual Studio Code。

    在 Mac 上有幾種安裝 git 的方式, 但我們推薦使用 XCode。 這在你以 iOS 或 macOS 為目標平台進行建置時非常重要。

    xcode-select --install
    

    如果你尚未安裝這些工具, 應該會開啟一個對話框,確認你是否要安裝。 點擊 Install,安裝完成後點擊 Done

  2. 下載並安裝 Visual Studio Code

    若要快速安裝 Flutter,並在之後編輯和除錯你的應用程式, 請安裝並設定 Visual Studio Code

    你也可以改為安裝並使用任何其他支援 VS Code 擴充功能的 Code OSS 編輯器。 若選擇如此,在本文的其餘部分, 請將 VS Code 視為你所選擇的編輯器。

  1. 安裝 Git for Windows

    下載並安裝最新版本的 Git for Windows

    如需安裝或疑難排解的協助, 請參閱 Git 文件

  2. 下載並安裝 Visual Studio Code

    若要快速安裝 Flutter,並在之後編輯和除錯你的應用程式, 請安裝並設定 Visual Studio Code

    你也可以改為安裝並使用任何其他支援 VS Code 擴充功能的 Code OSS 編輯器。 若選擇如此,在本文的其餘部分, 請將 VS Code 視為你所選擇的編輯器。

  1. 下載並安裝必要套件

    使用你偏好的套件管理器或安裝方式, 安裝以下套件的最新版本:

    • curl
    • git
    • unzip
    • xz-utils
    • zip
    • libglu1-mesa

    在使用 apt-get 的 Debian 系發行版(例如 Ubuntu)上, 請以下列指令安裝這些套件:

    sudo apt-get update -y && sudo apt-get upgrade -y
    sudo apt-get install -y curl git unzip xz-utils zip libglu1-mesa
    
  2. 下載並安裝 Visual Studio Code

    若要快速安裝 Flutter,並在之後編輯和除錯你的應用程式, 請安裝並設定 Visual Studio Code

    你也可以改為安裝並使用任何其他支援 VS Code 擴充功能的 Code OSS 編輯器。 若選擇如此,在本文的其餘部分, 請將 VS Code 視為你所選擇的編輯器。

安裝並設定 Flutter

#

現在你已安裝 Git 和 VS Code, 請依照以下步驟使用 VS Code 安裝並設定 Flutter。

  1. 啟動 VS Code

    如果尚未開啟,請透過 Spotlight 搜尋,或從安裝目錄手動開啟 VS Code。

  2. 將 Flutter 擴充功能加入 VS Code

    若要將 Dart 和 Flutter 擴充功能加入 VS Code, 請前往 Flutter 擴充功能的 Marketplace 頁面, 然後點擊 Install。 如果你的瀏覽器提示,請允許它開啟 VS Code。

  3. 使用 VS Code 安裝 Flutter

    1. 在 VS Code 中開啟指令面板(Command Palette)。

      前往 View > Command Palette 或按下 Cmd/Ctrl + Shift + P

    2. 在指令面板中,輸入 flutter

    3. 選取 Flutter: New Project

    4. VS Code 會提示你指定電腦上 Flutter SDK 的位置。 選取 Download SDK

    5. Select Folder for Flutter SDK 對話框出現時, 選擇你想要安裝 Flutter 的位置。

    6. 點擊 Clone Flutter

      在下載 Flutter 期間,VS Code 會顯示以下彈出通知:

      Downloading the Flutter SDK. This may take a few minutes.
      

      此下載需要數分鐘。 如果你懷疑下載已停頓,請點擊 Cancel,然後 重新開始安裝。

    7. 點擊 Add SDK to PATH

      成功後,會顯示以下通知:

      The Flutter SDK was added to your PATH
      
    8. VS Code 可能會顯示 Google Analytics 通知。

      如果你同意,請點擊 OK

    9. 確認 Flutter 可在所有終端機中使用:

      1. 關閉所有終端機視窗,然後重新開啟。
      2. 重新啟動 VS Code。
  4. 疑難排解安裝問題

    如果你在安裝過程中遇到任何問題, 請參閱 Flutter 安裝疑難排解

開始學習!

#

安裝 Flutter SDK 時會自動一併安裝 Dart。現在您可以開始建置 Flutter 應用程式了!

選用:從 Dart 開始

如果您是程式設計新手,可以先從 Dart 入門教學開始,學習 Dart 程式語言的基本概念。本教學的設計可銜接到 Flutter 入門教學。

開始學習

如果您已熟悉程式設計,可以跳過 Dart 教學,直接進入第一堂 Flutter 課程。