react-native window下创建Hello（解决创建一路的坑）

今天真的颇为激动，1年没有玩RN，竟然被最新的RN版本0.55.4创建Hello折腾了半天，想当年刚玩RN创建环境用了3天，

想想现在也是不容易啊半天就搞定了，目测以后创建的话也就1-2个小时就搞定了吧，哈哈 ，好了，先说说创建RN需要

那些工具：

其实不需要装python,先安装node,Git,JDK,都是傻瓜式地安装，jdk需要安装然后在环境变量里添加参数

（我是翻墙了，所以所以会快很多）

变量名  ：1.JAVA_HOME，变量值：你的java所在路径，如这是我的安装路径：C:\Java\jdk1.8.0_111

2.Path–>双击–>在添加%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;

3.CLASSPATH 变量值：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar 最前面有个点，代表的是当前路径
然后CMD 运行 java -version

下面就是安装 android-stuido  这个就按照，react-native官网的来创建，

我的项目就是AwesomeProject 也是安装官网的，

接着 我是在webStrom 配置RN

第一步：把项目打开

第二步：

第三步：

第四步：

第五步：

然后

用 which react-native 可以看到你 react-native安装的路径

第6步 就有这个 run ,当然你没有开启虚拟机 是会报错的，哈哈哈

第7步：你如果嫌弃没有高亮的语法 看着不舒服会报错，那就是你没有配置react和react-native

打开 WebStorm，在Preferences -> Language&FrameWorks -> JavaScript -> Libraries 中点击Download ,找到React和ReactNative下载，

然后选中新添加的两项执行Apply->OK 。

这样webstrom 里面的RN就配置好了：

截下来就是配置

genymotion 虚拟机了，哈哈这个确实挺坑的，这边就帮你少走弯路了哈哈

也是傻瓜式的安装 ，去官网需要注册并下载https://www.genymotion.com/，需要注册登录再下载的。注意下载with virtualBox版本，然后安装完成后需要登录，

就是刚才注册的账号。登录后进入这个页面做两个操作

点击那个ADD 然后有各样的虚拟机可以选择，我当然还是喜欢 iphone6 的了哈哈

然后运行 virtualBox 这个需要把我刚生成的这个文件夹下

双击打开然后就可以运行了 virtualBox ,然后双击点击start,就可以了，但是出现了

这个只要配置这个

已经勾选好了VT-x/AMD-V项，然后再选择配置把32-bit改成64-bit

在运行 start,然后又保存了，哈哈

这个就需要你配置SDK了，然后 就重新start下

然后又来了 这个在你的改虚拟机 没有开启 ，需要你在把你的电脑开启F2,bios 设置允许

推荐一个软件 LeoMoon CPU-V cpu 这个很强

如果下面2个√ 都是红色的 ，那么就是你的电脑不支持虚拟机，只有换咯，如果 只有最后一个是X

那么就需要你在开启开启BIOS 里面的VT了 ，

然后在双击 模拟机的 iphone 6 然后 然后有报错了，我也是醉了

报错：unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or youu’re runing a packager server

查了相关资料说是：初始化运行红屏错误 unable to load script from asset/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

然后 又华丽丽的报错了.......哈哈哈 感觉以前并没有这么错的呀，

然后找了些方法，哈哈

注：由于0.49版本以后的react-native没有index.android.js和index.ios.js文件，而统一合并成了index.js，

所以使用0.49及以后版本的请将第2步中的入口文件改为 index.android.js 改为 index.js,

第三步:再次执行 react-native run-android

然后在双击 模拟机的 iphone 6 哈哈，这次 等了一会 ，终于出现我想要的页面

完美 哈哈哈，以为舍不得买MAC，其实MAC下配置环境比window下更简单，真的，没有这么复杂，

有机会写一篇mac环境的创建吧。哈哈

所以也只是在window下玩玩RN，毕竟新公司不用RN，

但是我真的好喜欢RN，下半年就入手一台MAC，毕竟以前也玩过RN，相比VUE，配置环境也可以看出你能有多折腾

我真的真的是喜欢react,我不知道为什么 ，哈哈哈，好啦，

最后一句：人生还是需要折腾，不折腾就米不知道有啥惊喜给我们，

献给一起在大前端 奋斗的孩子，加油！加油！