iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 5
0
Mobile Development

前端工程師的 Flutter 新手村挑戰系列 第 5

【前端的 Flutter 新手村】Day5-在Mac中架設Flutter開發環境(二):安裝Flutter及Dart plugins

  • 分享至 

  • xImage
  •  

上一篇【前端的 Flutter 新手村】Day4-在Mac中架設Flutter開發環境(一):更新Android SDK、安裝Xcode安裝完Android SDK和Xcode,今天繼續把Flutter環境架完。目前還差Android Studio與VS Code plugins
https://ithelp.ithome.com.tw/upload/images/20190920/20121111b986wS7WU4.png
依照官方的步驟跟著做:

Android Studio

  • Step1. 開啟Android Studio,一樣在歡迎畫面中點右下角的"小齒輪Configure",然後選Plugins
    https://ithelp.ithome.com.tw/upload/images/20190920/20121111h0wlUwasov.png

  • Step2. 安裝Flutter Plugin
    https://ithelp.ithome.com.tw/upload/images/20190920/20121111Bosg71qNpL.png

    系統會問你要不要一起裝Dart Plugin,我們點Yes
    https://ithelp.ithome.com.tw/upload/images/20190920/20121111d5TxlFfMgu.png

  • Step3. 裝好Plugins後要重新啟動Android Studio,點Restart
    https://ithelp.ithome.com.tw/upload/images/20190920/20121111U2V1t02BnB.png

VS Code

  • 直接打開VS Code,在Extensions商店中安裝Flutter
    https://ithelp.ithome.com.tw/upload/images/20190921/20121111ShQx1749Ub.png

當所有SDK和Plugins都安裝完成後,Flutter醫生的檢驗就通過囉!!
https://ithelp.ithome.com.tw/upload/images/20190921/20121111TfXiPzUvrH.png

試著run看看App,是成功的呢~~
https://ithelp.ithome.com.tw/upload/images/20190921/20121111nl7aSRzxU4.png
明天再來教大家怎麼建立Flutter App,從什麼都沒有到模擬器產生出App的畫面,這過程也是充滿辛酸血淚呢/images/emoticon/emoticon02.gif


上一篇
【前端的 Flutter 新手村】Day4-在Mac中架設Flutter開發環境(一):更新Android SDK、安裝Xcode
下一篇
【前端的 Flutter 新手村】Day6-"Hello Flutter!" 用VS Code打造你的第一個Flutter App
系列文
前端工程師的 Flutter 新手村挑戰30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言