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


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