1. 程式人生 > >mac flutter 環境搭建

mac flutter 環境搭建

       flutter是最近比較火的新玩意,解決移動端跨平臺的痛點,且效能不輸原生開發。 在flutter之前,為了解決跨平臺,使用h5、mui+hbuilder、weex、ionic等不少解決方案,雖然都可以實現,但是效果都不怎麼理想。今天主要說說在mac上怎麼搭建flutter開發環境,我在搭建的過程中遇到不少坑,這裡給大家填坑,希望大家在搭建的時候能夠跳出這些坑,順利體驗一把新flutter。話不多說,開始幹活!

準備:首先要有jdk、androidstudio(3.1及以上)、android sdk環境。

第一步:安裝flutter:

1.開啟終端,cd到你要安裝的目錄

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

3.下載好flutter後就在當前目錄下執行: export PATH=`pwd`/flutter/bin:$PATH 

4. 如果下載失敗的話執行:export PUB_HOSTED_URL=https://pub.flutter-io.cnexport FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn,然後重複2和3即可

5.完成後cd 進入flutter,然後執行:flutter doctor,如果flutter sdk沒有安裝會進入安裝,此時需要等待一段時間。

6.安裝完畢後再執行flutter doctor 看看檢查結果

webp

紅x代表沒有安裝,綠色的勾才算安裝成功,我之前就安裝過了所以多個地方配置過綠色的勾會多點,你的不一定要和我一致,只要是flutter要是綠色的,安裝沒有問題的話,記住你安裝sdk的路徑。

7.Androidstudio需要安裝flutter外掛

webp

安裝好後重啟即可!

第二步:使用androidstudio新建flutter的helloworld

1.安裝flutter外掛重啟androidstudio後會發現多了一個選項如下:


webp

2.新建flutter專案

webp

選擇後點擊next就可以建立flutter專案了,可能需要等待一段時間。

完成後專案如下:

webp

3.執行專案(需要啟動安卓模擬器,如果沒有則建立一個,這裡就不說明了),

1.填坑1:這裡不得不說一個坑,我執行專案一直都是停在  initializing gradle...這個的地方沒有反應,原因是在下載gradle,非常慢,為了解決這個下載慢的問題,需要到網上下載相應的gradle包,開啟專案下的android>gradle>wepper>gradle-wrapper.properties 檢視gradle版本,如下:

webp

gradle下載地址:http://services.gradle.org/distributions/

我這裡是gradle-4.10.2-all.zip的版本,所以我下載的就是gradle-4.10.2-all.zip,這個根據自己的專案選擇版本。

下載好自後,開啟androidstudio的設定找到:檢視gradle路徑

webp

找個這個.gradle這個目錄,是隱藏的資料夾,mac使用shift+command+.來檢視隱藏檔案,找到.gradle>wrapper>dists把剛剛下載好的gradle解壓後拷貝進來:

webp

這樣gradle就配置好了,再次執行專案,發現還是報錯了。

2.填坑2:原因是因為google在國內無法訪問,需要使用阿里雲的映象:

開啟android下的builde.gradle:配置如下

webp

阿里雲映象:

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' }


處理完了專案還沒有完,還需要找到flutter sdk目錄下:flutter>packages>flutter_tool>gradle>fultter.gradle開啟:

也要修改成阿里雲的映象,如下:

webp

至此配置完畢,再次執行專案期待已久的flutter專案就執行起來了:


webp

三.總結:

關於flutter環境搭建就介紹到這裡了,如果有疑問歡迎評論留言。網上雖然教程多,但是坑還是很多。希望能幫助有需要的人,喜歡我的文章記得關注我哦!