iT邦幫忙

2021 iThome 鐵人賽

DAY 2
0
Mobile Development

30天 - Flutter 日常系列 第 2

[Day2] Flutter - 建置環境

Hi, 我是魚板伯爵今天要教大家如何建置環境 Flutter 開發環境。

Install Flutter (macOS)

https://flutter.dev/docs/get-started/install/macos

Get the Flutter SDK

  1. 下載以下安裝包以獲取Flutter SDK的最新穩定版本:
    flutter_macos_1.22.5-stable.zip

  2. 將文件打開到所需位置

$ cd ~/development
$ unzip ~/Downloads/flutter_macos_1.22.5-stable.zip
  1. 將Flutter工具添加到您的路徑:
$ export PATH="$PATH:`pwd`/flutter/bin"

如果路徑加入後會消失的話可以參考一下步驟:

  1. 開啟終端機後到達根目錄然後打開zshrc(如果因權限問題無法修改可輸入sudo vim .zshrc
$ cd ~
$ vim .zshrc

你也可以設定bash或其他的終端機。

  1. 輸入 i 來新增路徑你的Flutter(/bin:/Library/flutter/bin)安裝路徑在.bin:$PATH/後面,例如:
export PATH="$HOME/.yarn/bin:$HOME/.config/yarn/global/node_modules/.bin:$PATH/bin:/Library/flutter/bin"

輸入完成後, 按下esc然後:wq儲存

  1. 檢查是否成功設置

將設置的終端機關閉後重新開器一個新的終端機來檢查路徑是否設置成功。

$ which flutter

設置 VSCdoe

安裝VSCode的Dart套件包。

安裝VSCode的Flutter套件包。


設置 XCode

  1. 安裝Xcode的最新穩定版本(使用Web下載或Mac App Store)。
  2. 通過從命令行運行以下命令,將Xcode命令行工具配置為使用新安裝的Xcode版本:
$ sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
$ sudo xcodebuild -runFirstLaunch
  1. 通過一次打開Xcode並sudo xcodebuild -license從命令行確認或運行來確保Xcode許可協議已簽署 。

使用Xcode,你將能夠在iOS設備或模擬器上運行Flutter應用。


設置 模擬器

要準備在iOS模擬器上運行和測試您的Flutter應用,請執行以下步驟:

  1. 在終端機中輸入以下命令
$ open -a Simulator
  1. 點擊模擬器右鍵,選擇Device->IOS->選擇一個模擬器安裝。

  2. 安裝完後就開著


Create the app

首先創建一個新的專案,他會生成flutter所有需要的檔案。

$ flutter create my_app_name

接著檢查設備確認與設備連線,通常他創建完後會直接幫你執行。

$ flutter devices

1 connected device:
VScode右下角可以連接設備

可以使用VSCode的Debug執行,或者下面命令,成功後的畫面如下:

$ flutter run


Run flutter doctor

運行以下命令以查看是否需要安裝任何依賴項才能完成設置。

$ flutter doctor



上一篇
[Day1] Flutter - 簡介
下一篇
[Day3] Flutter - 改變容器風格 ( Container )
系列文
30天 - Flutter 日常30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言