[flutter] 開發(fā)環(huán)境配置詳解

1.下載/安裝 Flutter SDK

可以在其官網(wǎng)下載SDK它匕，或者在 GitHub flutter下載 Git 倉庫撇叁；這里我使用 Sourcetree 從其GitHub下載的倉庫，倉庫位置可以自定義劲藐，這里放在了系統(tǒng)根目錄下八堡，該路徑下面會用到：

/Users/LiuQiqiang/Flutter

2. 配置環(huán)境變量

在系統(tǒng)根目錄下，找到 .bash_profile文件瘩燥，使用文本編輯器打開秕重，將以下內(nèi)容，粘貼到文件中：

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PATH=/Users/LiuQiqiang/Flutter/bin:$PATH

這里的 PATH 為上面下載的 flutter 的路徑

如果沒有找到該文件厉膀，可以使用終端新建溶耘，或者直接使用vim 指令來編輯該文件，如果不存在會自動新建：

// 進入根目錄
$ cd ~

// 打開/新建 .bash_profile 文件
vim ~/.bash_profile

然后服鹅，按鍵盤 A 或者 i 進入編輯模式凳兵，復(fù)制上面文本，粘貼進去企软，接著按 ESC 退出編輯模式進入指令模式庐扫，按住 command + : ，輸入 wq仗哨，保存并退出形庭。

最后使用下面指令刷新該文件：

source ~/.bash_profile

這時，flutter 指令可以正常在該終端窗口中使用厌漂；

全局配置
如果我們關(guān)閉了終端萨醒，重新打開，或者新開一個終端窗口苇倡，會發(fā)現(xiàn) flutter 指令不能使用

command not found: flutter

我們需要將 flutter 的指令在任何窗口中生效富纸，有以下兩個方法添加相應(yīng)指令：

方式一
找到根目錄下的 .zshrc 文件囤踩，使用文本編輯器打開，然后在最后面添加以下指令：

source ~/.bash_profile

方式二
使用終端編輯

// 進入根目錄
$ cd ~

// 打開/新建 .zshrc 文件
vim ~/.zshrc

同樣晓褪，按照上面的指令進入編輯模式堵漱，添加以下內(nèi)容：

source ~/.bash_profile

保存退出即可！
重啟終端后涣仿，就可以在任意終端窗口中使用 flutter 指令勤庐。

第一次使用 flutter 指令時，會自動下載 Dart SDK变过、工具包等相關(guān)的內(nèi)容埃元，等待下載完成即可涝涤！

不出錯的話會出現(xiàn)下面的內(nèi)容：

成功

3. 檢查環(huán)境配置：flutter doctor

配置完成 flutter SDK 之后媚狰，我們可以使用下面的指令來檢查相關(guān)的配置是否生效：

flutter doctor

第一次執(zhí)行該指令的時候，會自動下載一些工具包阔拳，包括 Dart SDK等崭孤；運行結(jié)束后，控制臺會顯示相應(yīng)的環(huán)境配置情況：

圖中帶 ? 的都是需要修改的糊肠，帶?的都是配置完成的辨宠；
這里為配置完成了VS Code；
根據(jù)出錯的提示货裹，去完善相應(yīng)的配置嗤形。

4. 詳細配置

Android licenses

[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
  ? Android licenses not accepted.  To resolve this, run: flutter doctor
    --android-licenses

根據(jù)提示，終端輸入指令 flutter doctor --android-licenses 即可弧圆；主要是Android 相關(guān)的一些協(xié)議赋兵，輸入 y 會車接受即可，會有很多個搔预，挨個接受即可霹期；

Xcode - develop for iOS and macOS

[!] 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

Android Studio

[!] Android Studio (version 3.4)
    ? Flutter plugin not installed; this adds Flutter specific functionality.
    ? Dart plugin not installed; this adds Dart specific functionality.

這里 Android Studio 沒有安裝相關(guān)的插件，打開Android Studio：
在歡迎頁 Configure -> Plugins 打開插件管理面板

選擇 Marketplace 選項卡拯田，在搜索框內(nèi)輸入 flutter：

下載安裝第一個 Flutter历造。會同時安裝 Dart 插件，完成后重啟 IDE 即可船庇！
會發(fā)現(xiàn)多了個 flutter 工程的創(chuàng)建按鈕：

IntelliJ IDEA

電腦安裝了 IntelliJ IDEA 吭产，所以在使用 flutter doctor 的時候會有相應(yīng)的錯誤提示，很簡單鸭轮，只是缺少了 Flutter 和 Dart 插件：

[!] IntelliJ IDEA Community Edition (version 2019.2)
    ? Flutter plugin not installed; this adds Flutter specific functionality.
    ? Dart plugin not installed; this adds Dart specific functionality.

打開 IntelliJ IDEA臣淤，在歡迎頁，右下角张弛，選擇 Configure荒典，在彈出列表中選擇 Plugins：

在搜索框輸入 flutter酪劫，這時會查找不到任何插件：

點擊 Search in repositories ，在彈出的新窗口中寺董，搜索結(jié)果列表選擇 Flutter覆糟，然后 Install 即可：

此時會連同 Dart 的插件一同下載，完成后遮咖，重啟 IDE滩字，新建工程，選擇 Flutter 工程

所有的完成后御吞，終端重新輸入 flutter doctor 指令檢查一下即可：

其他

升級flutter版本

flutter upgrade