RN缺點：白話就是RN通過中間一個bridge，將Text 轉化成安卓代碼Text給安卓用，轉化成iOS代碼UILable 給蘋果用，這個bridge是單線程，業務太多，容易阻塞，用戶卡頓，還會造成ios和安卓代碼不一致，要頻繁判斷ios 跟安卓分別設置。
RN優點：完美實現熱更新

Flutter：直接跟安卓和ios進行操作，不需要通過橋，通過谷歌引擎，將蘋果的UILable變成Text。
缺點：蘋果不支持熱更，蘋果要嵌入谷歌引擎，包大。

開發?具Mac電腦：

• Xcode
• Android Studio https://developer.android.google.cn/studio
  • 要安裝插件Dart、Flutter，安裝完成后重啟Perference>Plugins
  • 安裝模擬器
• vs code https://code.visualstudio.com
  • 常用VScode插件
    • Bracket Pair Colorization 彩虹括號
    • Chinese (Simplified) 中文版插件
    • Dart 、 Flutter flutter開發插件

配置環境

1. 下載Flutter SDK 下載鏈接
2. 將安裝包zip解壓到你想安裝Flutter SDK的路徑（這個?錄以后不需要動，故不建議放在deskTop）
   3.添加 flutter 相關?具到path中

export PATH=`??存放flutter的路徑`/flutter/bin:$PATH

4.配置鏡像

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

5.運? flutter doctor 查看安裝結果如何

image.png

如果報這個錯，其中這個cmdline-tools component is missing Run path/to/sdkmanager --install "cmdline-tools;latest"怎么辦呢，意思是cmdline-tools這個東西沒有安裝，我們在Android Studio中的設置里找到并安裝即可，如下圖

image.png

之后還有Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
我們運行這個命令，之后要輸入數次y，最后提示
All SDK package licenses accepted
就是成功了

再輸入flutter doctor 就全是綠色對號了

提示
flutter的開發環境配置好后，退出終端，再進入終端，輸入flutter doctor命令后，會顯示，zsh: command not found: flutter的錯誤，原因是新版Mac 從bash變成了zsh

open ~/.zshrc 

如果文件不存在

vim ~/.zshrc 

open ~/.bash_profile

//添加下面三行，保存

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PATH=/Users/計算機名稱/flutter/bin:$PATH  //flutterSDK的路徑替換一下

然后執行

source ~/.bash_profile

然后把bash_profile的文件復制到zshrc中去

創建一個項目

flutter create flutterdemo（項目名不能有大寫）

1.vscode 創建，安裝插件Dart、Flutter，Awesome Flutter Snippets
直接在搜索框 （沒有的話就 command+shift+p）

image.png

Flutter: New Project

2.用Android Studio 直接new flutter project

image.png

網絡請求 這里選擇用VSCode開發
pubspec.yaml 文件里面引用框架和圖片等，如要使用http網絡請求，要在文件中引用一下

dependencies:
  flutter:
    sdk: flutter
http: ^1.0.0

image.png