Flutter環(huán)境搭建

記錄MAC環(huán)境下配置Flutter開(kāi)發(fā)環(huán)境,并解決編譯遇到的異常

前期準(zhǔn)備

1、AndroidStudio 3.3.2

2、XCode

相關(guān)資源下載

1、鏡像設(shè)置
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
2、下載Flutter資源包

下載資源有兩種方式:

1、使用 git clone Flutter 倉(cāng)庫(kù)的 方式 倉(cāng)庫(kù) releases 地址為 https://github.com/flutter/flutter/releases

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

2、去flutter官網(wǎng)下載其最新可用的安裝包,下載地址,筆者這里下載的是 flutter_macos_v1.2.1-stable.zip 穩(wěn)定1.2.1 版本

git clone 的速度相對(duì)較慢,筆者這里采用的第二種方式,這里分享一個(gè)小技巧,在下載頁(yè)點(diǎn)擊下載后,可以在瀏覽器拷貝文件下載地址使用 迅雷打開(kāi),下載速度會(huì)有飛速提升。

配置環(huán)境變量

1、在你的開(kāi)發(fā)目錄下解壓上一步下載的 flutter_macos_v1.2.1-stable.zip
cd ~/development
unzip ~/Downloads/flutter_macos_v1.2.1-stable.zip
2、環(huán)境變量配置

1、拷貝Flutter 的目錄 [電腦目錄](méi)/develop/flutter

2、打開(kāi)[電腦目錄](méi)/.bash_profile 文件,可以使用 記事本打開(kāi)

添加以下行,并修改YOUR_DIRECTORY為 機(jī)器實(shí)際目錄

export FLUTTER="[YOUR_DIRECTORY]/develop/flutter"
export PATH="${FLUTTER}/bin:$PATH"

運(yùn)行 source .bash_profile 刷新當(dāng)前PATH

使用echo $PATH 查看當(dāng)前環(huán)境變量

3、環(huán)境校驗(yàn)

1、終端執(zhí)行 flutter doctor

如果提示 不存在此命令 則環(huán)境變量未設(shè)置成功,請(qǐng)重復(fù)執(zhí)行 第二步

第一次執(zhí)行會(huì)相對(duì)較慢,耐心等待即可

執(zhí)行過(guò)程中可能出現(xiàn)的問(wèn)題:

1、XCode 版本太低

2、AndroidStudio 版本太低,筆者這里使用的 3.3.2版本沒(méi)有問(wèn)題

3、缺失ANDROID_HOME 環(huán)境變量

4、check licenses time out 根據(jù) flutter 提示執(zhí)行相關(guān)命令

5、缺少開(kāi)發(fā)插件環(huán)境,會(huì)提示 brew install … 類似命令,安裝homebrew 并執(zhí)行相應(yīng)命令即可

4、編輯器

筆者這里使用的是AndroidStudio 作為Flutter 的編輯器,相對(duì)于VS Code來(lái)說(shuō),AndroidStudio 的代碼提示會(huì)好一點(diǎn)

AndroidStudio Preferences>Plugin>Browse repositories… 搜索Flutter 插件,安裝Flutter 插件會(huì)自動(dòng)下載Dart插件,如果第一次下載失敗,重復(fù)下載即可,不需要開(kāi)啟 代理

安裝完成后重啟AndroidStudio

創(chuàng)建Flutter 應(yīng)用

點(diǎn)擊Start a new Flutter project

![step3.jpg](https://upload-images.jianshu.io/upload_images/6113442-1c53fafa97e21d37.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

這里選擇 Flutter Application即可,剩下的就 next 即可

點(diǎn)擊運(yùn)行可能會(huì)卡在這個(gè)部分并且報(bào)錯(cuò)

1、報(bào)錯(cuò)1 download kotlin 失敗

step4.png

這里提示的是 android環(huán)境 kotlin 依賴失敗

解決: 打開(kāi) abdroid > build.gradle 文件

配置allprojects

allprojects {
    repositories {
        google()
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

2、報(bào)錯(cuò)二

這里我忘記貼圖了 關(guān)鍵的 報(bào)錯(cuò)信息是:

no cache in .gradle/caches/4.10.2

打開(kāi) android/gradle/wrapper/gradle-wrapper.properties 文件

修改 distributionUrl=https\://services.gradle.org/distributions/gradle-4.10.2-all.zip為你經(jīng)常使用的gradle 版本

接下來(lái)就可以 愉快的 run application 了

step5.jpg
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • flutter是最近比較火的新玩意,解決移動(dòng)端跨平臺(tái)的痛點(diǎn),且性能不輸原生開(kāi)發(fā)。 在flutter之前,為了解決跨...
    Code人生閱讀 4,179評(píng)論 1 8
  • 回鄉(xiāng)記 2016.2.21 前天,舅舅給媽媽打電話,說(shuō)身體不好,也想媽了...
    紫陌_e902閱讀 1,204評(píng)論 5 9
  • 我在河邊迷惘 碧落黃泉水,洗不凈羈絆 迷霧朦朧,掩住的,是誰(shuí)的面容 無(wú)聲的嘶吼恍若未聞 你度過(guò)那河,挽起青絲,黛眉...
    韞白不太白閱讀 150評(píng)論 0 0
  • 人有很多劣根性。想來(lái)都覺(jué)不寒而栗??炊嗔巳碎g百態(tài),便少了純真,多了算計(jì)。 自私自利是人的本性,但過(guò)了就讓人不能接受...
    晉軒姐姐閱讀 306評(píng)論 0 1

友情鏈接更多精彩內(nèi)容