需求:App需要一个热更新的功能,可以默认更新用来修正线上问题
实现路线:
- 使用微软的依赖包 react-native-code-push
- 实现步骤
全局安装code-push-cli | npm i -g code-push-cli | ||
注册 CodePush账号 | code-push register | 可以使用github账号 | |
在CodePush服务器注册App | code-push app add 应用平台命名 平台名称 使用的框架/语言 | 可以在App center中使用界面操作, Distribute -> Code Push -> create standerd deployment -> 右上角应该有2个deploymentkey | |
将deployment 的key添加到Xode配置文件中 | |||
添加依赖react-native-code-push | |||
将依赖包上传到服务器上,目前服务器用的是官方的 | code-push release-react XXX-ios-test-2 ios --t 1.6.8 --dev false --d Production --m true | code-push release-react <项目名称> <platform> --t <version(用来判断和哪个版本匹配)> --dev false --d <deployment 的类别> --m true(是否强制更新) |
优点:开发时间少,简单,容易,只需要阅读一些文档即可
缺点:需要单独的服务器,上架时需要更多说明
2 手动热更新(只有Android实现了一个Demo,目前还在开发中)
实现步骤:
- 查询RN框架热更新需要的贮备知识,推荐一下几个网站
1 通过对RN热更新的剖析来感受热更新思维 - 简书 --原理和代码片段
2 ReactNative手动实现热更新 - 灰信网(软件开发博客聚合)--原理和代码片段
3 【稀饭】react native 实战系列教程之热更新原理分析与实现_画虎烂的博客-CSDN博客 --android中RN运行原理图写的很好
4 android 版的 assets 图集资源,react-native 热更新(android)_心选办公的博客-CSDN博客 --android的bundle包的路径,否则图片不显示
5 什么是好的热更新系统? - 简书 - 打bundle包
- android
npx react-native bundle --entry-file index.js --bundle-output ./bundle/android/assets/index.android.bundle --platform android --assets-dest ./bundle/android/res --dev false - ios
// todo
- android
- 将bundle包打成zip包,按照上面android版assets图集资源,所需要的路径进行排版,并上传oss中
- 下载并解压缩zip
// todo 代码片段,整理后更新 - getJSBundleFile方法中替换更新包
// todo 代码片段,整理后更新
需要理解的概念:
- 原生代码相当于壳,入口、交互一切的起点都在原生发起
-
MainActivity做了3件事
A:填写我们的RN模块名;
一个ReactActivity相当于一个磁带盒/CD盒,每一个ReactActivity启动的时候就会根据getMainComponentName返回的模块名去加载对应的CD(JS 文件集合)。
读者问题1):模块名是在哪里注册?怎么得到这些模块名?
解: getMainComponentName,js中是 AppRegisterComponent。个人认为模块名的作用就是用来验证,js的bundle包别用错了
读者问题2):如何根据模块名去寻找对应的JS文件集合呢?
解: 通过类ReactNativeHost中getJSMainModuleName() --仅在dev环境下使用,获取js 的bundle包;
getJSBundleFile()是 自定义bundle包,需要返回bungle包的路径
getBundleAssetName()是 返回在assets文件夹中的bundle的名称,assets文件夹是只读的,这个方法返回的是打包后默认的bundle的文件名称
B:创建一个ReactActivity的代理ReactActivityDelegate
所谓代理是什么呢,就是遇到不想做或者不方便做的事,我就把权限发给某一个人让他帮忙做,那么他就是我的代理。
读者问题3):为什么要创建这个代理?
解:就像是有一个大庄园,你是主人,你是通过管家管理更加方便,还是所有的事情亲力亲为去做会更方便,是一个道理。
C:最关键的是继承自ReactActivity
ReactActivity是RN应用的基本类,它封装了所有RN与原生相关的东西。