mac os + flutter + vscode 最詳細的配置以及使用方法

Flutter是谷歌的移動UI框架,可以快速在iOS和Android上構建高質量的原生用戶界面。 Flutter可以與現有的代碼一起工作。在全世界,Flutter正在被越來越多的開發者和組織使用,並且Flutter是完全免費、開源的。
這裏詳細介紹一下 Flutter 在mac 上的環境部署以及開發準備。Flutter 是爲了跨平臺而生的,所以爲了驗證在iOS和Android 的運行情況,必須先在mac 上配置好 iOS 的開發環境 Xcode 和 Android 的開發環境 Android Studio。這裏我就不在展開寫 Xcode 和 Android Studio 的安裝配置過程了。


mac上搭建Flutter開發環境(vscode)


1)安裝Flutter SDK
2)iOS 環境配置
3)Android Studio配置
4)VS code 配置

1)安裝Flutter SDK

安裝方法:這裏使用的是git安裝

//1.終端中輸入以下指令克隆項目
git clone -b beta https://github.com/flutter/flutter.git
//2. 導出到Flutter保存路徑
export PATH=`pwd`/flutter/bin:$PATH

由於國內網絡限制我們可以通過修改鏡像地址來解決, 好在Google良心,專門給我們大陸提供了方案, 終端中一次輸入以下命令即可解決。

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
git clone -b dev https://github.com/flutter/flutter.git
export PATH="$PWD/flutter/bin:$PATH"

此時執行

flutter doctor

flutter doctor 是 flutter 對mac本機的環境配置診斷腳本,腳本結果會直接放出 flutter 環境有哪些需要繼續配置的。按照提示執行腳本即可。

下圖是我的執行結果:
在這裏插入圖片描述
以上檢測iOS,Android環境說明沒有問題。

2)VS code 配置

VS code的Flutter配置也很簡單:

打開VS code -> Extentions管理
在搜索框中搜索 Flutter
搜索到Flutter, 點擊安裝即可
Dart環境也是自動會安裝好
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章