React Native學習筆記(二)---運行開源App,形成直觀感受

React Native學習筆記(二)—運行開源App,形成直觀感受

Taylor Guo @ 2017年09月10日

看了幾個教學視頻,直接訓練使用的React Native官方文檔中的指南英文版中文版

我覺得這樣挺仔細的,但我沒那麼多時間,希望能更快一點。直接使用了react-native-ganke項目來修改、練手和學習。


項目安裝

先下載項目文件,然後按照以下步驟進行操作。

這裏寫圖片描述


項目啓動

啓動後,可能會遇到以下問題:

這裏寫圖片描述

額,問題來了!


打開調試工具

先看是什麼問題,cmd + D

這裏寫圖片描述

打開Chrome調試工具

這裏寫圖片描述

先看重點問題:程序沒有註冊,初始化時require()出錯 或者 無法調用組件註冊。

先去 index.ios.js,發現 GankIO名字沒有問題。

再看react-native和react版本,react-native版本是app要求的版本,react版本不是。
刪除ios/build的build目錄,重新npm安裝react版本,build app。
仍然出錯,無果。

繼續查找錯誤中。。。 2017年09月10日-23:25.


苦悶

折騰了一整天,直到9月11號凌晨2點半GanIO的這些問題都沒有很好的解決,不知道問題出現在哪裏,甚至不知道如何去排查問題!非常苦悶。

於是,換了好幾個開源App,基本都是有問題的。

這裏寫圖片描述

不知道是不是React Native還在不停地改進的問題,還是安裝過程中各種版本問題。

關鍵問題,對零基礎新手來說,還是非常挑戰的。

面對這諸多困難,我選擇了逃避!鄙視我吧!

等我繞回來再來了解這些難題吧!


柳暗花明

所以不能繼續耽誤下去了。

找了最新的開源APP,React Conf 2017 Companion App,這個是React Conf 2017 APP,React Native開發。

Clone代碼後 ,用Yarn安裝。

安裝Yarn:

brew update
brew install yarn

安裝完成後,在Xcode中打開ios目錄下面的ReactConf2017.xcodeproj,build and run。

這裏寫圖片描述



終於看見這一縷曙光!


發佈到真機,看看效果

真機調試

  • 1. 可以去蘋果官網¥688購買一年的開發者賬號

這裏寫圖片描述

  • 2. 可以用Apple ID

這裏寫圖片描述

真機結果

  • 1. Debug發佈到真機,卡爆了!

這裏寫圖片描述

  • 2. Release 發佈到真機,還可以!

這裏寫圖片描述

交互還不錯,還比較流暢!




那就愉快地決定用這款英文編輯軟件了!

2017年9月12日-11:50


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章