一、環(huán)境搭建
1.克隆項(xiàng)目
git clone -b beta https://github.com/flutter/flutter.git
2.將flutter加入path(讓在任何目錄下都可調(diào)用flutter)
打開.bash_profile(一般在Mac的當(dāng)前用戶目錄下)盟劫,編輯添加
export PATH=[克隆項(xiàng)目的目錄]/flutter/bin:$PATH
cenghaihandeMacBook-Pro:~ catchzeng$ vim ~/.bash_profile
[[ -s "$HOME/.profile" ]] && source "$HOME/.profile" # Load the default .profile
[[ -s "$HOME/.rvm/scripts/rvm" ]] && source "$HOME/.rvm/scripts/rvm" # Load RVM into a shell session *as a function*
# added by Anaconda2 5.1.0 installer
export PATH="/Users/catchzeng/anaconda2/bin:$PATH"
export PATH=/Users/catchzeng/flutter/bin:$PATH
運(yùn)行source刷新
source ~/.bash_profile
驗(yàn)證PATH是否包含了flutter
cenghaihandeMacBook-Pro:~ catchzeng$ echo $PATH
/Users/catchzeng/flutter/bin:/Users/catchzeng/anaconda2/bin:
3.安裝iOS環(huán)境依賴
$ brew install --HEAD libimobiledevice
$ brew install ideviceinstaller ios-deploy cocoapods
4.安裝 VS Code
5.安裝dart code
dart code
6. 運(yùn)行flutter doctor,驗(yàn)證是否有錯(cuò)誤
cenghaihandeMacBook-Pro:~ catchzeng$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[?] Flutter (Channel beta, v0.1.5, on Mac OS X 10.13.3 17D102, locale en-CN)
[?] Android toolchain - develop for Android devices (Android SDK 25.0.2)
[?] iOS toolchain - develop for iOS devices (Xcode 9.2)
[?] Android Studio (version 3.0)
[?] VS Code (version 1.21.1)
[?] Connected devices (1 available)
? No issues found!
二涡戳、新建項(xiàng)目
1.調(diào)出命令行面板(快捷鍵Command+Shift+P)皿淋,輸入flutter選擇Flutter: New Project,回車妥粟,輸入項(xiàng)目名并選擇保存路徑
命令行面板
新建項(xiàng)目
demo
2.確認(rèn)設(shè)備連接
設(shè)備連接
3.打開項(xiàng)目目錄下的ios/Runner.xcworkspace审丘,并修改簽名信息
簽名信息
4.按下F5開始Debug調(diào)試
Debug
Demo
5.隨意修改main.dart,然后Command+s保存勾给,便能看到效果滩报,這就是Flutter的熱加載,方便調(diào)試
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
'You have pushed the button this many times 測(cè)試:',
),
new Text(
'$_counter',
style: Theme.of(context).textTheme.display1,
),
],
Demo