超詳細!mac flutter 創建過程及遇到的問題

參考

1.入門: 在macOS上搭建Flutter開發環境 系統要求

2.Mac 打開、編輯 .bash_profile 文件

雖然網上有教程,但是過程中遇到些問題,這些問題教程里并沒有,所以寫這個文章記錄一下。

1.打開終端

2.clone flutter

命令:

git clone -b beta https://github.com/flutter/flutter.git

到此步終端報錯:

error: RPC failed; curl 18 transfer closed with outstanding read data remaining

fatal: The remote end hung up unexpectedly

fatal: early EOF

fatal: index-pack failed

解決辦法看這一篇: git clone 報錯:error: RPC failed; curl 18 transfer closed with outstanding read data remaining 解決辦法

3.打開(或創建) .bash_profile

1.打開

終端輸入:

open -e .bash_profile

如果不能成功打開,那就創建

2.創建

1.進入當前用戶的home目錄(默認就是)

cd ~

cd /Users/用戶名

4.更新環境變量

打開bash_profile就是為了可以永久的更新環境變量,一勞永逸。請看解釋和注意后根據自己的需要來將代碼添加到打開的bash_profile。

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

解釋: 由于一些flutter命令需要聯網獲取數據,如果您是在國內訪問,由于眾所周知的原因,直接訪問很可能不會成功。 上面的PUB_HOSTED_URLFLUTTER_STORAGE_BASE_URL是google為國內開發者搭建的臨時鏡像。你也可以不設置,如果你能翻墻的話。如果不能的話可以直接復制上面的代碼

export PATH= PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH

注意PATH_TO_FLUTTER_GIT_DIRECTORY 為你flutter的路徑,比如在當前用戶路徑里。如果不確定,可以點擊mac上面菜單的"前往" --> "個人",然后在此文件夾里找是否有flutter文件夾。如果有的話你的應該這樣寫:

export PATH= /Users/用戶名/flutter/bin:$PATH

然后輸入以下命令更新剛剛配置的環境變量:

source .bash_profile

然后輸入以下命令,通過運行flutter/bin命令驗證目錄是否在已經在PATH中:

echo $PATH

如果看到有flutter那就是配置好了

5.運行 flutter doctor

輸入下面這個命令,來看還有沒有要安裝的依賴項:

flutter doctor

我的話一開始是這個

提示flutter版本太低

讓我更新flutter,我不想看到warning所以立馬更新了。

flutter upgrade

錯誤1:

然后就看x了,這是我第一個打叉的地方

[?] Android toolchain - develop for Android devices
    ? Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.io/setup/#android-setup for detailed instructions).
      If Android SDK has been installed to a custom location, set $ANDROID_HOME to that location.

這是讓我安裝android studio并且設置好$ANDROID_HOME這個環境變量。

于是我便按照提示打開https://developer.android.com/studio/index.html,并且下載安裝了android studio。

安裝后最好運行一下android studio,好安裝andriod sdk。運行好根據界面提示點下一步,如果沒有sdk會提示安裝,只要點就行了。記得查看下安裝路徑,一般路徑都是在當前用戶的Library文件夾里。

安裝好sdk后,可以把android studio關了。

然后打開bash_profile

open -e .bash_profile

在bash_profile里加上

export ANDROID_HOME="/Users/用戶名/Library/Android/sdk" //android sdk目錄,替換為你自己的
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

更新配置

source .bash_profile

然后運行

flutter doctor

看這一項還報錯不。ok還是有報錯,報錯如下:

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

根據提示運行:

flutter doctor --android-licenses

然后根據提示一直y,y到結束為止。

錯誤2:

這是我第二個打叉的地方

[!] iOS toolchain - develop for iOS devices
    ? 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
    ? libimobiledevice and ideviceinstaller are not installed. 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

依舊是根據提示,我去App Store安裝了xcode。

安裝好后根據之前的錯誤信息運行:

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

然后:

brew install --HEAD libimobiledevice

再然后:

brew install ideviceinstaller

又然后:

brew install ios-deploy

還然后:

brew install cocoapods

最后然后:

pod setup

進行到這我報錯了:

[!] /usr/bin/git clone https://github.com/CocoaPods/Specs.git master --progress

Cloning into 'master'...
remote: Counting objects: 2353094, done.        
remote: Compressing objects: 100% (450/450), done.        
error: RPC failed; curl 18 transfer closed with outstanding read data remaining
fatal: The remote end hung up unexpectedly
fatal: early EOF
fatal: index-pack failed

弄個加速器就可以了。我用的云墻netfits,有試用,試用夠下載了。如果有更好的加速器歡迎留言。

再運行doctor

flutter doctor

ios還有報錯:

[!] iOS toolchain - develop for iOS devices (Xcode 9.4.1)
    ? Missing Xcode dependency: Python module "six".
      Install via 'pip install six' or 'sudo easy_install six'.

按照提示輸入'pip install six' 或 'sudo easy_install six'。然后再運行doctor,我這里ios沒有報錯了。就剩錯誤3里的報錯。

錯誤3:

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

android studio里還少了兩個插件。我們打開andriod studio。

1.點擊preferences

image

2.搜索plugins

image

3.搜索flutter

image-20180813214903100

4.點擊安裝

image-20180813215025154

有彈框提示要安裝dart,同意。等安裝好后重啟andriod studio。

結語

當doctor沒有錯誤的時候,那就是裝好了。但是為了方便開發,我們還需要對編輯器做配置。鑒于這個比較容易,而且不太出現錯誤,所以我就不寫了。大家自己參考文檔來。

參考文檔:起步: 配置編輯器

據量子力學得到,點贊這篇文章的人都會成為歐皇,從此過著開心幸福的生活??。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容