React Native初体验

初步学习React Native

之前学习了混合式开发框架IONIC，发现这个上手很快，因为大部分控件框架中都有提供了，然后看到了React Native ，它充分利用了Facebook的现有轮子，是一个非常优秀的集成作品，而且现在适用性来说，React Native 是比 IONIC 更广为人知的，所以这里打算开始学习下，一方面可以拓展自身的知识面，另一方面学习的过程中也可以将 它们两者进行一个对比，从中选择更适合自己的开发方式。
这里先推荐两个学习网址：
第一个毫无疑问是官网了，第二个是React Native中文学习网站，里面有对官网的翻译，也有一些额外的教程。

搭建环境：

学习之前必然要先搭建运行环境了，由于我之前学习 IONIC ，一些基本的环境已经搭建好了，这里就不再描述，详细的可以查看上面推荐的中文学习网站，里面已经写得十分详细了。

生成并运行项目

在node.js中输入下面的命令操作：
**react-native init AwesomeProject
cd AwesomeProject
react-native run-android**
这里如果你比较幸运的话就可以在手机上看到运行效果了，当然往事开头难，一开始难免会遇到各种各样的问题。

问题一：

Unable to load script from assets ‘index.android.bundle’……

这个问题的关键在于缺少了 index.android.bundle 这个文件，然后各种百度也说是在android目录下缺少了assets文件夹，然后没有生成对应的index.android.bundle这个文件，然后网上给出的解决方法如下：
第一步：在Android/app/src/main目录下创建一个空的assets文件夹，
第二步：进入项目根目录执行下面代码：
react-native bundle –platform android –dev false –entry-file index.android.js –bundle-output android/app/src/main/assets/index.android.bundle –assets-dest android/app/src/main/res/
但是你在输入上面这串代码的时候会发现还是报错，因为项目里面根本没有所谓的 index.android.js 文件，下面是这个项目的根目录：

这时候又各种百度这个文件是什么，然后有人说了新版本没有了index.android.js 和 index.ios.js ，整合到了App.js 里了，一看目录的确有一个 App.js 的文件，抱着试一下的心态，我将上面的 index.android.js 换成了 App.js ：

react-native bundle –platform android –dev false –entry-file App.js –bundle-output android/app/src/main/assets/index.android.bundle –assets-dest android/app/src/main/res/

的确在assets目录下生成了两个文件，这时候心里一阵狂喜，终于搞定了，然后满怀激情的输入了， react-native run-android， 结果出乎意料又在情理之中的还是报错了，好吧果然没有什么事可以随随便便成功。既然bug出现了，那就只能去解决了。
bug如下：

然后又是各种百度（原谅我，最近敏感时期，梯子都不好用了），结果试了各种所谓的解决方法还是没有任何效果，在我即将心灰意冷的时候突然想到会不会是我上一步就出错了，assets生成的文件本身就是错的。之后我再目录里面仔细的搜索，又发现了一个 index.js 文件，想到已经没有什么其他办法了，只能重新尝试一下了，于是乎我把第二步的命令行改成了下面这个：

react-native bundle –platform android –dev false –entry-file index.js –bundle-output android/app/src/main/assets/index.android.bundle –assets-dest android/app/src/main/res/

只是将其中的 App.js 替换成 index.js ，运行后发现是可以的，也有生成对应的文件，再运行下 react-native run-android 发现竟然可以了。简直要喜极而泣。终于把项目跑起来了。
第三步：重新运行后就可以了。

这里将问题记录了下，一方面是自己可以查看，另一方面也希望能帮到其他人少走弯路。