windows系统Android真机开发react native（踩坑）

登陆react native官网https://reactnative.cn/docs/getting-started.html

根据官网的提示“我们建议直接使用搜索引擎搜索下载 Node 、Python2 和Java SE Development Kit (JDK)”

一直按照官网的步骤走，把上面这些东西装上，但Android studio装上不知道有什么用，我用Android studio打开项目没检测到项目，新手，不太清楚。不过我还是把它装上了，建议装上，后面万一有用呢。

按照官网的指示，走到这一步，react-native init AwesomeProject也没什么问题，我是翻墙的，建议翻墙。

然后我用的真机来调试，用的是Android4.3的机器，数据线连上电脑，输入adb devices

List of devices attached 下面有东西的话说明连上了，这里我没连手机。

进入到刚才创建的那个项目目录里，运行react-native run-android，

失败，忘记截图了，错误是

Unable to load script.Make sure you are either running a Metro server or that your bundle 'index.android.bundle' is packaged correctly for release

参考这个

在 项目里的android/app/src/main目录下创建一个新的文件夹assets

在终端里输入（我此时终端的目录在项目里面）

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

最后

react-native run-android

正常的话手机上就运行成功。到这里，从来没有打开过Android studio。

到这一步开始了踩坑

首先是用Android studio打开项目，

说我没有sdk，我点cancel

继续cancel

然后点ok

到了这里，根据官网的提示，装上Android 9

然后打开创建的项目

什么都没有，应该是找不到Android项目，从没有做过原生Android，知识盲区。找了很多博客，发现有人说调试用WebStorm，打包用Android studio，下了一个WebStorm。用WebStorm直接打开项目，右上角

点这个框，Edit Configuration,

出来一页配置，我直接点的OK。配置完，右上角的绿色箭头可以点了。

想输出一个hello world

我复制粘贴官网的代码在App.js，想输出一个hello world。然而我点了一次还是运行不成功。我只能在控制台里运行react-native run-android，控制台能成功。但是输出的还是初始创建的界面，还是没有hello world。我把webStorm关了，用记事本，打开App.js.把hello world的代码复制进去。运行，成功输出hello world。

调试

根据官网所说

按两下R键，这是虚拟机的操作，真机要Reload JS，哪儿找Reload JS？又去翻博客，原来是

摇一摇！

拿着手机摇一摇，会弹出

原来Reload在这里，不是Reload JS。后面有个Settings,把电脑的ip和端口号8081输进去。然后再点击Reload，结果报错，

一刷新就报错，说我没连上服务器。打开服务器

在控制台里，输入react-native start

打开这个框就算是打开本地服务器了。我又摇，还是同样的报错，我找了另外一台和我电脑连接同一个路由器的电脑，ping我的电脑ping不通，防火墙的原因，我索性把防火墙给关了。

再摇，这下reload之后，也正常了。在WebStorm随便改代码，保存。手机上马上刷新了，神奇。把数据线拔了也可以马上刷新，只要手机要和电脑连在同一个WiFi。

总结一下：

1.记得添加assets目录

2.用WebStorm编辑

3.记得打开本地服务器 react-native start，别关控制台。