如何在Windows、MacOS上搭建Flutter開發環境(詳細篇)

zane發表於2019-05-01

特別說明:如果讀者還不會科學上網!請先停止學習,因為讀者不可能將Flutter開發環境搭建成功,所以先去學學科學上網,而且能開啟谷歌了,再返回來學習效率會更高。

Flutter開發環境搭建(Windows版)

系統要求

要想在Windows上成功安裝並執行Flutter,讀者的系統開發環境必須滿足以下最低要求:

  • 作業系統:Windows7或更高版本的64位(64-bit)作業系統;
  • 磁碟空間:大於3GB,雖然官方說的是400MB,但是還需要安裝Android Studio和虛擬機器,所以至少要3GB左右,如果能達到5GB就更好了,這樣就可以滿足安裝多個虛擬機器的要求;
  • 工具:Flutter依賴以下這些命令列工具

Java開發工具包的下載與安裝

下載Java開發工具包

Java開發工具包下載地址,這個地址會隨著Java升級而有所變化,如果已經改變了,請百度一下搜尋java下載或者直接到Java官網下載。

Java開發工具包
首先點選紅框中的圓圈,然後根據讀者的系統是64位還是32位來選擇版本,筆者的系統是64位的,所以選擇最下面的Windows x64版本。

安裝Java開發工具包

首先,下載完成後雙擊執行進行安裝,直接點選下一步下一步就可以了,安裝路徑讀者隨意;

最後,安裝完成後到終端(cmd命令列)中輸入java,能出現下圖中的結果,說明安裝成功。

CMD命令列

獲取Flutter SDK

  1. 讀者前往Flutter官網下載其最新可用的安裝包,官網下載地址(地址如失效,請速速聯絡筆者)
    Windows-Flutter SDK
    注意:Flutter的渠道版本會不停的變動,請以Flutter官網為準;另外,讀者也可以去Github Flutter專案中去下載安裝包,下載地址
  2. 下載完成後將安裝包zip解壓到讀者想要解壓的路徑下(注意:不要將安裝包zip解壓到需要一些高許可權的路徑下,如C:\Program Files\
  3. 在安裝包zip已解壓目錄的flutter檔案下找到flutter_console.bat,雙擊執行並啟動flutter命令列,接下來讀者就可以在Flutter命令列中執行flutter命令了。

配置環境變數

如果讀者想在終端CMD命令列執行flutter命令,而不是通過flutter_console.bat來執行flutter命令,需要新增以下環境變數到系統Path中:

  • 控制皮膚>系統和安全>系統>高階系統設定>環境變數
  • 在“系統變數”下檢查是否有名為“Path”的條目:
    • 如果該條目存在,追加flutter\bin的全路徑(如D:\Development_Tools\Flutter_SDK\flutter\bin),使用 ; 作為分隔符
    • 如果該條目不存在,建立一個新系統變數Path ,然後將flutter\bin的全路徑作為它的值

配置映象

由於在國內訪問Flutter有時可能會受到限制,Flutter官方為中國開發者搭建了臨時映象,讀者需要在使用者環境變數中配置映象伺服器地址:

PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
複製程式碼

配置映象伺服器
說明:此映象為臨時映象,並不能保證一直可用,讀者可以參考 flutter.io/community/c… 以獲得有關映象伺服器的最新動態。

執行flutter doctor命令

在CMD命令列或Flutter命令列執行如下命令來檢視是否還需要安裝其他依賴,如果需要,安裝(盤)它:

flutter doctor
複製程式碼

該命令檢查讀者的環境並在命令列視窗中顯示報告。Dart SDK已經打包在Flutter SDK裡了,沒有必要單獨安裝Dart,仔細檢查命令列輸出資訊,以獲取可能需要安裝的其他軟體或進一步需要執行的任務。

C:\Users\Administrator>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel master, v1.1.10-pre.214, on Microsoft Windows [Version 10.0.17134.706], locale zh-CN)
[√] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[√] Android Studio (version 3.0)
[!] IntelliJ IDEA Ultimate Edition (version 2017.2)
    X Flutter plugin not installed; this adds Flutter specific functionality.
    X Dart plugin not installed; this adds Dart specific functionality.
[!] Connected device
    ! No devices available

! Doctor found issues in 2 categories.
複製程式碼

以上為筆者的命令輸出資訊,讀者在自己的電腦上執行flutter doctor看到的命令輸出資訊當中的[X]肯定會比筆者的多一些,因為讀者還沒有安裝Android Studio(簡稱AS),那麼接下來講解一下如何下載安裝AS。

Android Studio下載與安裝

理論上可以使用任何文字編輯器與命令列工具來構建Flutter應用程式。 不過,Flutter官方建議使用Android Studio和VS Code之一的編輯器以獲得更好的開發體驗。Flutter官方分別提供了這兩款編輯器的Flutter外掛,通過編輯器整合Flutter外掛的方式,可獲得程式碼補全、語法高亮、widget編輯輔助、執行和除錯支援等功能,可以幫助我們極大的提高開發效率。

下載AS

AS安裝包直接到官網上進行下載即可,官網地址,進入官網後點選“Android Studio”選單欄,然後看到如下介面,點選“DOWNLOAD ANDROID STUDIO”按鈕進行下載。

官網
點選“我已閱讀並同意上述條款及條件”,進行打勾;然後點選“下載ANDROID STUDIO FOR WINDOWS”按鈕,即可下載:
AS下載

安裝AS

AS安裝包下載完成後,雙擊進行安裝,安裝過程差不多就是點選下一步下一步,讀者如果真的不會安裝,請參考AS下載安裝與配置教程

AS安裝完成後開啟CMD命令列再執行flutter doctor命令來驗證是否安裝成功。

安裝Android證照

安裝好AS後,再次開啟CMD命令列,輸入flutter doctor命令,這時候的[X]會明顯減少,但是讀者有可能還會遇到1~2個[X],其中有一個就是提示沒有安裝Android證照,安裝證照需要在CMD命令列中執行以下的命令:

flutter doctor --android-licenses
複製程式碼

然後會提示讀者選Y/N,不要猶豫,一律選擇Y,就可以把證照安裝成功。

AS上安裝Flutter外掛

開啟AS客戶端,點選File > Settings > Plugins > Browse Repositories > 輸入Flutter > Install

Flutter外掛
安裝完成後,讀者需要重新啟動一下AS客戶端。

AS建立Flutter專案

  1. 點選File > New Flutter Project
  2. 點選Flutter application作為project型別,然後點選Next
  3. 輸入專案名稱(如 myapp),然後點選Next
  4. 點選Finish
  5. 等待Android Studio安裝SDK並建立專案

AS執行Flutter專案

  1. 定位到AS工具欄:
    AS工具欄
  2. 在target selector中,選擇一個執行該應用的Android裝置。如果沒有列出可用,請選擇Tools > Android > AVD Manager並建立一個。
  3. 在工具欄中點選Run圖示。
  4. 在讀者的真機裝置或模擬器上將會看到啟動的應用程式。
    執行效果

VS Code下載與安裝

VS Code是一個輕量級編輯器,支援Flutter執行和除錯。

下載VS Code

VS Code安裝包直接到官網上進行下載即可,官網地址,進入官網後點選“Download”按鈕,然後看到如下介面,點選Windows按鈕進行下載:

VS Code下載

安裝VS Code

VS Code安裝包下載完成後,雙擊進行安裝,安裝過程差不多就是點選下一步下一步。

VS Code上安裝Flutter外掛

  1. 啟動VS Code客戶端
  2. 點選View > Command Palette...
  3. 輸入install,然後選擇Extensions:Install Extensions
  4. 在輸入框中輸入Flutter,在搜尋結果列表中選擇Flutter,然後點選Install
  5. 選擇OK,重新啟動VS Code
  6. 驗證配置
    • 點選View > Command Palette...
    • 輸入doctor,然後選擇Flutter:Run Flutter Doctor
    • 檢視OUTPUT視窗中的輸出內容是否有問題

VS Code建立Flutter專案

  1. 啟動VS Code客戶端
  2. 點選View > Command Palette...
  3. 在輸入框中輸入Flutter,在搜尋結果列表中選擇Flutter:New Project
  4. 輸入Project名稱(如myapp), 然後按Enter鍵
  5. 指定放置專案的位置,然後按藍色的確定按鈕
  6. 等待專案的建立,並顯示main.dart檔案

VS Code執行Flutter專案

開啟TERMINAL視窗,執行flutter run命令,如圖所示:

TERMINAL視窗
按Enter鍵,等待編譯執行,執行成功後應該在讀者的真機裝置或模擬器上將會看到啟動的應用程式。

Flutter開發環境搭建(MacOS版)

系統要求

要想在MacOS上成功安裝並執行Flutter,讀者的系統開發環境必須滿足以下最低要求:

  • 作業系統:MacOS的64位(64-bit)作業系統
  • 磁碟空間:大於700MB(不包括Xcode或Android Studio的磁碟空間,如果包括的話,最好大於3GB)
  • 工具:Flutter依賴bash、mkdir、rm、git、curl、unzip、which這些命令列工具

獲取Flutter SDK

  1. 讀者前往Flutter官網下載其最新可用的安裝包,官網下載地址(地址如失效,請速速聯絡筆者)
    MacOS-Flutter SDK
    注意:Flutter的渠道版本會不停的變動,請以Flutter官網為準;另外,讀者也可以去Github Flutter專案中去下載安裝包,下載地址
  2. 下載完成後將其安裝包解壓到讀者想要解壓的目錄下,如:
cd ~/development
unzip ~/Downloads/flutter_macos_v0.5.1-beta.zip
複製程式碼

配置環境變數

將Flutter新增到PATH中,讀者可以在任何終端會話工具中執行flutter命令。

  1. 開啟終端會話工具,使用vim進行配置環境變數,命令如下:
vim ~/.bash_profile
複製程式碼
  1. bash_profile檔案裡,新增以下路徑:
export PATH=/development/flutter/bin:$PATH
複製程式碼

注意:以上路徑要根據讀者將壓縮包解壓到的實際目錄來進行編寫,當然讀者也可以和筆者一樣,將壓縮包解壓至根目錄下的development資料夾下。

  1. 配置完成後,需要用source命令重新載入一下,具體命令如下:
source ~/.bash_profile
複製程式碼

注意: 如果讀者使用的終端是Zsh,終端啟動時~/.bash_profile將不會被載入,解決辦法就是修改~/.zshrc,在其中新增:source ~/.bash_profile

  1. 檢測環境變數配置是否成功
flutter -h
複製程式碼

如下圖所示,說明環境變數配置成功。

配置成功

配置映象

由於在國內訪問Flutter有時可能會受到限制,Flutter官方為中國開發者搭建了臨時映象,讀者需要在環境變數中配置映象伺服器地址:

  1. 開啟終端會話工具,使用vim進行配置環境變數,命令如下:
vim ~/.bash_profile
複製程式碼
  1. 在bash_profile檔案裡,新增以下路徑:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
複製程式碼
  1. 配置完成後,需要用source命令重新載入一下,具體命令如下:
source ~/.bash_profile
複製程式碼

注意: 如果讀者使用的終端是Zsh,終端啟動時~/.bash_profile將不會被載入,解決辦法就是修改~/.zshrc,在其中新增:source ~/.bash_profile

說明:此映象為臨時映象,並不能保證一直可用,讀者可以參考 flutter.io/community/c… 以獲得有關映象伺服器的最新動態。

Xcode下載與安裝

讀者如果想要在iOS裝置上構建並執行Flutter應用程式,那麼就需要下載安裝Xcode9.0或更高版本。

  1. 下載安裝Xcode9.0或更新版本(通過連結下載蘋果應用商店);
  2. 配置Xcode命令列工具以使用新安裝的Xcode版本;
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
複製程式碼

對於大多數情況,當讀者想要使用最新版本的Xcode時,這是正確的路徑,但如果讀者需要使用不同的版本,請指定相應路徑。

  1. 確保開啟Xcode時同意了Xcode許可協議或者通過命令sudo xcodebuild -license同意了Xcode許可協議。

Android Studio下載與安裝

讀者如果想要在Android裝置上構建並執行Flutter應用程式,那麼就需要下載安裝Android Studio(簡稱AS)。

下載AS

AS安裝包直接到官網上進行下載即可,官網地址,進入官網後點選“Android Studio”選單欄,然後看到如下介面,點選“DOWNLOAD ANDROID STUDIO”按鈕進行下載。

官方網站
點選“我已閱讀並同意上述條款及條件”,進行打勾;然後點選“下載ANDROID STUDIO FOR MAC”按鈕,即可下載:
AS下載

安裝AS

AS安裝包下載完成後,使用MacOS獨特的安裝方法,拖拽即可安裝成功。

AS安裝完成後開啟終端工具執行flutter doctor命令來驗證是否安裝成功。

安裝Android證照

安裝好AS後,再次開啟終端工具,輸入flutter doctor,這時候的[X]會明顯減少,但是讀者有可能還會遇到1~2個[X],其中有一個就是提示沒有安裝Android證照,安裝證照只要在終端工具中執行以下的命令。

flutter doctor --android-licenses
複製程式碼

然後會提示讀者選Y/N,不要猶豫,一律選擇Y,就可以把證照安裝成功。

AS上安裝Flutter外掛

開啟AS客戶端,點選Preferences > Plugins > Browse Repositories > 輸入Flutter > Install

MacOS-Flutter外掛
安裝完成後,讀者需要重新啟動一下AS客戶端。

AS建立Flutter專案

  1. 點選File > New Flutter Project
  2. 點選Flutter application作為project型別,然後點選Next
  3. 輸入專案名稱(如 myapp),然後點選Next
  4. 點選Finish
  5. 等待Android Studio安裝SDK並建立專案

AS執行Flutter專案

  1. 定位到AS工具欄:
    AS工具欄
  2. 在target selector中,選擇一個執行該應用的Android裝置。如果沒有列出可用,請選擇Tools > Android > AVD Manager並建立一個。
  3. 在工具欄中點選Run圖示。
  4. 在讀者的真機裝置或模擬器上將會看到啟動的應用程式。
    執行效果

VS Code下載與安裝

VS Code是一個輕量級編輯器,支援Flutter執行和除錯。

下載VS Code

VS Code安裝包直接到官網上進行下載即可,官網地址,進入官網後點選“Download”按鈕,然後看到如下介面,點選Mac按鈕進行下載:

MacOS-VSCode

安裝VS Code

VS Code安裝包下載完成後,使用MacOS獨特的安裝方法,拖拽即可安裝成功。

VS Code上安裝Flutter外掛

  1. 啟動VS Code客戶端
  2. 點選View > Command Palette...
  3. 輸入install,然後選擇Extensions:Install Extensions
  4. 在輸入框中輸入Flutter,在搜尋結果列表中選擇Flutter,然後點選Install
  5. 選擇OK,重新啟動VS Code
  6. 驗證配置
    • 點選View > Command Palette...
    • 輸入doctor,然後選擇Flutter:Run Flutter Doctor
    • 檢視OUTPUT視窗中的輸出內容是否有問題

VS Code建立Flutter專案

  1. 啟動VS Code客戶端
  2. 點選View > Command Palette...
  3. 在輸入框中輸入Flutter,在搜尋結果列表中選擇Flutter:New Project
  4. 輸入Project名稱(如myapp), 然後按Enter鍵
  5. 指定放置專案的位置,然後按藍色的確定按鈕
  6. 等待專案的建立,並顯示main.dart檔案

VS Code執行Flutter專案

開啟TERMINAL視窗,執行flutter run命令,如圖所示:

TERMINAL視窗
按Enter鍵,等待編譯執行,執行成功後應該在讀者的真機裝置或模擬器上將會看到啟動的應用程式。

安裝其他軟體

讀者再次使用終端執行flutter doctor進行檢測,如出現以下內容:

  To install, run:
    brew install --HEAD libimobiledevice
    brew install ideviceinstaller
✗ ios-deploy not installed. To install:
    brew install ios-deploy
✗ CocoaPods not installed.
    CocoaPods is used to retrieve the iOS platform side's plugin code that responds to your plugin usage on the Dart side.
    Without resolving iOS dependencies with CocoaPods, plugins will not work on iOS.
    For more info, see https://flutter.io/platform-plugins
  To install:
    brew install cocoapods
    pod setup
複製程式碼

大概意思就是需要安裝這些軟體,而且Flutter推薦使用brew命令進行安裝,因此讀者可以直接在終端工具裡輸入下列命令:

brew install --HEAD libimobiledevice
brew install ideviceinstaller
brew install ios-deploy
brew install cocoapods
pod setup
複製程式碼

每輸完一個命令都要等待一會兒,等待軟體包安裝成功!

連線裝置執行Flutter應用

Windows下只支援Android裝置構建並執行Flutter應用,而MacOS則同時支援iOS和Android裝置。下面分別介紹如何連線Android和iOS裝置來執行Flutter應用。

連線Android模擬器

讀者如果需要在Android模擬器上執行並測試Flutter應用,請按照以下步驟操作:

  1. 啟動Android Studio > Tools > Android > AVD Manager並選擇Create Virtual Device
  2. 選擇一個裝置並點選Next
  3. 選擇一個或多個系統映像(建議使用 x86 或 x86_64 image),然後點選Next
  4. 在“Emulated Performance”下,選擇Hardware - GLES 2.0以啟用硬體加速
  5. 驗證AVD配置是否正確,然後點選Finish。有關上述步驟的詳細資訊,請參閱Managing AVDs
  6. Android Studio:在“Android Virtual Device Manager”中,點選工具欄的Run圖示,在模擬器上將會看到啟動的應用程式。
  7. VS Code:開啟TERMINAL視窗,執行flutter run命令,在模擬器上將會看到啟動的應用程式。

連線Android真機裝置

讀者如果需要在Android真機裝置上執行並測試Flutter應用,需要Android 4.1(API level 16)或更高版本的Android真機裝置。

  1. 在Android真機裝置上啟用開發人員選項USB除錯。詳細說明可在Android官方文件中找到。
  2. 使用USB將手機插入電腦。如果裝置出現除錯授權提示,請授權你的電腦可以訪問該裝置。
  3. 在編輯器中,開啟TERMINAL視窗,執行flutter device命令,以驗證編輯器識別讀者連線的Android真機裝置。
  4. Android Studio:在“Android Virtual Device Manager”中,點選工具欄的Run圖示,在Android真機上將會看到啟動的應用程式。
  5. VS Code:開啟TERMINAL視窗,執行flutter run命令,在Android真機上將會看到啟動的應用程式。

連線iOS模擬器

讀者如果需要在iOS模擬器上執行並測試Flutter應用,請按照以下步驟操作:

  1. 在你的MacOS上,通過 Spotlight 或以下命令找到模擬器:
open -a Simulator
複製程式碼
  1. 通過檢查模擬器Hardware > Device選單中的設定,確保模擬器正在使用64位裝置(iPhone 5s或更高版本)。
  2. 根據讀者電腦螢幕大小,模擬高清屏iOS裝置可能會溢位螢幕。可以在模擬器的Window> Scale選單下設定裝置比例。
  3. 在編輯器上執行flutter run命令來啟動Flutter應用程式。

連線iOS真機裝置

讀者要想將Flutter應用安裝到iOS真機裝置,需要一些額外的工具和一個Apple帳戶,還需要在Xcode中進行一些設定。

  1. 安裝homebrew(如果已經安裝了brew,跳過此步驟)。
  2. 開啟終端並執行如下這些命令:
brew update
brew install --HEAD libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods
pod setup
複製程式碼

每輸完一個命令都要等待一會兒,等待成功!如果這些命令中的任何一個失敗並出現錯誤,請執行brew doctor命令並按照說明解決問題。

  1. 遵循Xcode簽名流程來配置讀者的專案:
    • 在讀者的Flutter專案目錄中通過open ios/Runner.xcworkspace開啟預設的Xcode workspace。
    • 在Xcode中,選擇導航皮膚左側中的Runner專案。
    • Runnertarget設定頁面中,確保在General > Signing > Team下選擇了開發團隊。當選擇一個團隊時,Xcode會建立並下載開發證照,向裝置中註冊帳戶,並建立和下載配置檔案(如果需要)。
    • 開發第一個iOS開發專案,可能需要使用Apple ID登入Xcode。
      登入Xcode
      任何Apple ID都支援開發和測試,但若想將應用分發到App Store,就必須註冊Apple開發者計劃,有關詳情讀者可以自行了解。
    • 當第一次attach真機裝置進行iOS開發時,需要同時信任Mac和該裝置上的開發證照。首次將iOS裝置連線到MacOS時,請在對話方塊中選擇Trust
      Trust
      然後,轉到iOS裝置上的設定選單,選擇常規>裝置管理並信任讀者的證照。
    • 如果Xcode中的自動簽名失敗,請驗證專案的General > Identity > Bundle Identifier值是否唯一。
      Bundle Identifier
    • 在編輯器上執行flutter run命令來啟動Flutter應用程式。

Flutter SDK升級

升級Flutter SDK和依賴包

要升級Flutter SDK,只需一行命令:

flutter upgrade
複製程式碼

該命令會同時更新Flutter SDK和讀者的Flutter專案依賴包,如果只想要更新專案依賴包(不包括Flutter SDK),可以使用如下命令:

  • flutter packages get獲取專案所有的依賴包
  • flutter packages upgrade獲取專案所有依賴包的最新版本

Flutter SDK分支

Flutter SDK有多個分支,如beta、dev、master、stable,其中stable分支為穩定分支(日後有新的穩定版本釋出後可能也會有新的穩定分支,如1.0.0),dev和master為開發分支,安裝Flutter後,讀者可以執行flutter channel檢視所有分支,如筆者本地執行後,結果如下:

Flutter channels:
  beta
  dev
* master
複製程式碼

帶"*"號的分支即讀者本地的Flutter SDK跟蹤的分支,要切換分支,可以使用flutter channel betaflutter channel master,Flutter官方建議跟蹤穩定分支,但讀者也可以跟蹤master分支,這樣可以檢視最新的變化,但這樣穩定性要低的多。

常見配置問題

Error runing Gradle錯誤解決

在Debug專案的時候,應該最常見的錯誤就是類似下面這樣的錯誤了。

Launching lib/main.dart on Android SDK built for x86 in debug mode...
Initializing gradle...
Resolving dependencies...
* Error running Gradle:
ProcessException: Process "/Users/rabbit/develop/android/flutter_app/android/gradlew" exited abnormally:
Project evaluation failed including an error in afterEvaluate {}. Run with --stacktrace for details of the afterEvaluate {} error.

FAILURE: Build failed with an exception.

* Where:
Build file '/Users/rabbit/develop/android/flutter_app/android/app/build.gradle' line: 25

* What went wrong:
A problem occurred evaluating project ':app'.
> Could not resolve all files for configuration 'classpath'.
   > Could not find lint-gradle-api.jar (com.android.tools.lint:lint-gradle-api:26.1.2).
     Searched in the following locations:
         https://jcenter.bintray.com/com/android/tools/lint/lint-gradle-api/26.1.2/lint-gradle-api-26.1.2.jar

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 0s
  Command: /Users/rabbit/develop/android/flutter_app/android/gradlew app:properties

Finished with error: Please review your Gradle project setup in the android/ folder.
複製程式碼

這個問題的產生的原因,還是中國特有的問題,解決方案是改為阿里的連結。

  1. 修改專案下的android目錄下的build.gradle檔案,把google()和jcenter()這兩行去掉。改為阿里的連結。
maven { url 'https://maven.aliyun.com/repository/google' }
maven { url 'https://maven.aliyun.com/repository/jcenter' }
maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
複製程式碼

全部程式碼:

buildscript {
    repositories {
        //  google()
        //  jcenter()
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public'}
        }
        dependencies {
        classpath 'com.android.tools.build:gradle:3.1.2'
    }
}

allprojects {
    repositories {
        // google()
        // jcenter()
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
    }
}

rootProject.buildDir = '../build'
subprojects {
    project.buildDir = "${rootProject.buildDir}/${project.name}"
}
subprojects {
    project.evaluationDependsOn(':app')
}

task clean(type: Delete) {
    delete rootProject.buildDir
}
複製程式碼

注意是有兩個部分進行了修改,不要只修改一處。

  1. 修改Flutter SDK包下的flutter.gradle檔案,這個目錄要根據讀者的SDK存放的位置有所變化。比如筆者放在了D盤Flutter目錄下,那路徑就是這個。
D:\Flutter\flutter\packages\flutter_tools\gradle
複製程式碼

開啟檔案進行修改,修改程式碼如下(其實也是換成阿里的路徑就可以了)。

buildscript {
    repositories {
        //jcenter()
        // maven {
        //     url 'https://dl.google.com/dl/android/maven2'
        // }
        maven{
            url 'https://maven.aliyun.com/repository/jcenter'
        }
        maven{
            url 'http://maven.aliyun.com/nexus/content/groups/public'
        }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.1.2'
    }
}
複製程式碼

然後再重新Debug一下,就基本可以啟動起來。

還有一種錯誤是說硬體沒有啟動GPU,需要下載安裝一個程式,這個提示的很清楚,不做過多的介紹了。

缺少依賴庫問題

錯誤如下圖所示,此時點選超連結即可自動跳轉到安裝頁面:

缺少依賴庫
安裝之後重新執行即可:
AS安裝成功

連線不上Android Repository

這也是最常見的問題之一,當你發現自己無法下載部分依賴的時候,請優先考慮這種情況。進入File -> Settings -> Appearance & Behavior -> System Settings -> Android SDK -> SDK Update Sites列表,可以看到此時的Android Repository無法連線。

解決方法如下:

  1. 進入C:\windows\system32\drivers\etc\
  2. 開啟hosts檔案
  3. 新增203.208.41.32 dl.google.com即可解決

安卓包配置問題

一般格式為

Could not HEAD **
Could not Get **
複製程式碼

如:Android Studio Could not GET gradle-3.2.0.pom,這一類問題是由於無法連線到 Maven 庫造成的,解決方法如下:

  1. 進入當前所在專案名/android
  2. 開啟build.gradle
  3. 找到下面這一部分,並加上maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
allprojects {
   repositories {
     google()
     jcenter()
     maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' } //新增這一句
   }
}
複製程式碼
  1. 進入File -> Settings -> Build, Execution, Deployment -> Gradle -> Android Studio中,勾選上Enable embedded Maven repository,重啟Android Studio即可解決。
    如何在Windows、MacOS上搭建Flutter開發環境(詳細篇)

注意:存在這樣的一種情況,當讀者根據上述步驟設定了之後,依舊無法解決這個問題,並有類似於Could not HEAD maven.aliyun.com的報錯資訊,請檢查C:\Users\{user_name}\.gradle\gradle.properties是否有設定代理,刪除後問題即可解決。

最後,希望大家都能安裝成功,以上只是筆者的安裝過程,不敢保證全部正確;不過筆者還是儘量詳細的描述瞭如何在Windows、Mac上搭建Flutter開發環境的過程,希望可以幫助到Flutter的開發者。

相關文章