簡要
本文重點介紹MacOS上使用VSCode快速搭建Flutter開發平臺。
獲取Flutter SDK
下載SDK
方式一:直接下載
storage.googleapis.com/flutter_inf…
方式二:從GitHub上拉取
git clone https://github.com/flutter/flutter.git
複製程式碼
配置啟動項
vim $HOME/.bash_profile
export PATH="$PATH:[FLUTTER_DIRECTORY]/flutter/bin"
複製程式碼
Flutter Doctor
flutter doctor
複製程式碼
![基於VSCode快速上手Flutter](https://i.iter01.com/images/689c286d174b9839333a9aeb906f7ff904fc7cbc57877b616edbf73ffd1d05fc.png)
由於我們僅需要在VSCode中開發,關於IntelliJ IDEA上的一些配置可暫時忽略。
SDK版本管理(channel)
檢視channel列表
flutter channel
複製程式碼
![基於VSCode快速上手Flutter](https://i.iter01.com/images/ba27d12165a15c4a00c1a77b82c79b0c40da6fdc003ee95276fca2e63070ca38.png)
切換channel
flutter channel stable
複製程式碼
chanel其實就是git分支,Flutter做了一層包裝而已。每次切換channel時,會checkout至新分支,並重新build工具。 一般使用stable即可,想要嚐鮮可以切換至beta。
配置VSCode
安裝VSCode
安裝Flutter和Dart外掛
![基於VSCode快速上手Flutter](https://i.iter01.com/images/97039d36a364bc97039f0f12c579824792ce48f874e170af6fb0d7e8b398b2b1.png)
建立Flutter專案
![基於VSCode快速上手Flutter](https://i.iter01.com/images/5d388dee348a4f04a03ab48dd33bf57ebb1174a436e2d6fa8905c0e71cd82b2b.png)
開啟除錯
![基於VSCode快速上手Flutter](https://i.iter01.com/images/463da2e07bb8064c3ed0526ab19ada88527bb45714107820ce126018ab0dfa19.png)
![基於VSCode快速上手Flutter](https://i.iter01.com/images/1b3cdc6422c3a505400a794bececd3ff3e1e20c360f18375eadc4821a1882527.png)
![基於VSCode快速上手Flutter](https://i.iter01.com/images/0299da1f04349055c7aa2b724a5d079fae167cdaece7c85d9f7d13427be9a2ac.png)
參考文件
- [官方文件] flutter.dev/docs/get-st…
- [DevTools] flutter.github.io/devtools/vs…