在手机运行第一个RN应用

一、环境: 电脑: win7
node、java、android环境
react、react-native版本
(
环境搭建中python不是必需的,
大部分参考https://www.cnblogs.com/morang/p/react-native-java-build.html
)
2、当你参考上面的文章到第四、5步 react-native start时后
用浏览器访问http://localhost:8081/index.android.bundle?platform=android查看服务端是否已成功启动时可能会提示:
Error: Unable to resolve module './index.android'
我的解决方案是复制一份项目根目录下的index.js命名为index.android.js放到同一目录下
(已成功,网上说0.49后已经将index.android.js与index.ios.js合并为index.js一个文件,除了这个解决方案应该有更好的,希望各位教教我,这个感觉就很麻烦)
成功后会浏览器会出现一堆js代码
3、继续按照https://www.cnblogs.com/morang/p/react-native-java-build.html做下去,进行真机运行,
值得注意的是手机要开启开发者模式(每个手机可能不一样,自己百度),之后在开发者选项(每个手机叫法可能不一样)中打开usb调试
4、最好先来源https://www.cnblogs.com/morang/p/react-native-java-build.html
不然会很慢
5、在这里插入图片描述
点击右下角RELOAD
在这里插入图片描述
左右摇手机 会出现下面的
在这里插入图片描述
点击最后一个选项,出现下面
在这里插入图片描述
点击debug server host &port device输入你的ip地址端口号(默认8081)

我出现的错误
连接不到开发服务器
翻译了下连接不到开发的服务器。

请按照以下的步骤来修复此问题:

  • 确保包服务器在运行
  • 确保你的设备或者模拟器连接着电脑,并且手机打开了USB调试模式,然后在cmd中运行adb devices来查看已经连接好的设备列表
  • 确保飞行模式是关闭的 如果是使用真机来开发,输入 adb reverse tcp:8081
  • tcp:8081来检查设备 输入IP:8081
    1、首先检查包服务器是否运行正常。
    检查网址为: http://localhost:8081/index.android.bundle?platform=android
    在项目文件夹下输入react-native start或者npm start均可开启服务器
    我出现的页面是
    error
    解决方法1:参考(https://www.cnblogs.com/honeynm/p/9007072.html)
    在react-navtive根目录下cmd执行mkdir 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/
    命令会在assets目录下生成两个文件(我只生成了一个而已)

    6、重新启动
    cmd---------------->react-native run-android
    还是报错
    在这里插入图片描述

https://stackoverflow.com/questions/55391746/could-not-determine-artifacts-for-androidx-appcompatappcompat1-0-2-no-cached说应该Gradle 的问题,没学过Gradle
只能打开android studio看看可不可以
android studio打开
android studio打开
要选择这个(之所以强调这个,是因为我第一次玩安卓,直接把整个项目根目录打开,不知道怎么运行,流下了无知的眼泪)
运行后竟然可以出现
在这里插入图片描述
感动~~~~

但是之后还是总出现could not connect to development server这个错误,
还得再研究研究

另外参考的文章(https://stackoverflow.com/questions/44803681/how-to-use-index-js-instead-of-index-ios-js-index-android-js-in-react-native)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值