前段時間，google在2018世界移動大會上發布了Flutter的beta版本，Flutter是一個跨平臺開發框架，兼容了iOS及Android，底層語言采用Dart。
在聽聞Flutter的渲染基礎是自己實現的，在性能上可能更優于RN的時候，不禁對它產生了興趣，接下來是我的初步安裝及簡單編譯的體驗。

環境及準備工作

我用的是mac系統，所以接下來基本以Mac環境為準。
xcode9.0+
Visual Studio Code
需要的依賴：bash，mkdir，rm，git，curl，unzip，which其中不少Mac可能已經安裝過，并不需要重復安裝了

安裝

首先，從克隆項目

git clone -b master https://github.com/flutter/flutter.git 

克隆完成后添加臨時路徑,可以執行flutter命令，路徑根據自己的下載地址，因為我是下載到用戶目錄下的，所以用的 ~

export PATH=~/flutter/bin:$PATH 

查看依賴

flutter doctor 

查看輸出日志

62E5C19B-6A51-48AC-B7FB-B64929F2C387.png

這里有的部分依賴是可以不必安裝的，這里因為目前我只考慮在iOS模擬器上跑，用VSCode作IDE，所以，IntelliJ IDE和Android Studio都沒有處理。

4D4D85A1-B8B6-4D3E-A724-B37C3DA21015.png

體驗

VSCode安裝Flutter插件，快捷鍵cmd+shift+p

E9BE08E8-6BFA-462F-B05B-E063411F32B1.png
創建項目并取名字

這里如果是iOS的項目，需要先用xcode編譯之后，再用VSCode D1000F61-B1F0-44C0-8F1F-CA0A8E636906.png

就可以進行啟動了

之后我們可以一直在VSCode上修改代碼，保存后模擬器的內容會動態變化，不過因為是beta階段，有時候可能無法完成這一工作，我們只需要重新啟動調試即可。

圖片.png

更新永久路徑，可在任何終端窗口使用使用flutter命令。
1.打開~目錄下的.bash_profile文件。
2.增加以下條目：

export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn export PATH_TO_FLUTTER_GIT_DIRECTORY=/Users/guolei/flutter export PATH=${PATH}:${PATH_TO_FLUTTER_GIT_DIRECTORY}/bin 

其中PATH_TO_FLUTTER_GIT_DIRECTORY為flutter的所在的路徑
3.添加完成后執行命令：source ~/.bash_profile

以上如無意外便基本流程完成了。

更新Studio For Mac配置流程：

要求:Studio3.0+
1.啟動Studio，點擊Configure選擇Plugins

image.png
2.點擊Browse Repositories
image.png
3.搜索Flutter與Dart插件并安裝
image.png
4.重啟Studio

本頁內容由塔燈網絡科技有限公司通過網絡收集編輯所得，所有資料僅供用戶學習參考，本站不擁有所有權，如您認為本網頁中由涉嫌抄襲的內容，請及時與我們聯系，并提供相關證據，工作人員會在5工作日內聯系您，一經查實，本站立刻刪除侵權內容。本文鏈接:http://m.junxiaosheng.cn/17686.html