React-native初次运行红屏问题

每次阅读源码或者使用新的第三方SDK的时候，总想爆一句The fucking code or The fucking document ~~

真实坑多！这里稍微总结一下自己集成RN的一些经验

其实集成react-native按照文档来环境肯定没问题

中文文档地址：https://reactnative.cn/docs/getting-started.html

英文文档地址：https://facebook.github.io/react-native/docs/getting-started.html

另一个升级版的地址：https://reactnative.cn/docs/0.50/getting-started.html

由于我的环境是window10上搭建的，下面就来说遇到的一些问题

1、The SDK directory <SDK Location> does notexist

解决办法，android的sdk 是否配置了ANDROID_HOME 环境变量，而且要在用户变量里面去设置，同时可以配置一下platform和platform-tools的环境变量

2、 unable to load script from asset/index.android.bundle

扫描二维码关注公众号，回复： 3509968 查看本文章

网上很多博客，但是解决办法都一样那就是：

原因：assets中没有成功打包出index.android.bundle文件

　　解决：1.去（你的项目文件夹）\android\app\src\main目录下新建asset文件夹

　　　　　2.终端下运行

　　　　　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

　　　　　3.再次执行 react-native run-android

还有的解决办法是删除初始化的node_modules，然后重新用命令yarn add或者npm install重建，同时复制local.properties到android目录，这些试了都没用

后来的终极解决办法是另起一个react-native的版本去初始化项目，才终于成功，命令如下

react-native init MyApp --version 0.55

这样初始化的项目直接就可以用命令react-native run-android直接跑起来，个人总结是因为最新版本是0.56但是文档没更新所以react-native run-android命令可能不适用了，反正低于0.56版本的都可以

3、还有就是端口8081被占用的问题，可以另起一个端口来启动

react-native start --port=8082
或者永久修改Server端口

参考文章：https://blog.csdn.net/fengyuzhengfan/article/details/77389953

React-native初次运行红屏问题

猜你喜欢