利用CodePush对react-native项目热更新(以android为例)

CodePush是提供给React native 或 Cordova开发的一个中央仓库，开发者可以将js、image等代码资源上传上去，客户端启动的时候根据版本拉去CodePush上的代码进行覆盖来实现客户端的热更新。

1,安装CodePush
npm install -g code-push-cli
 



安装成功显示目录:



2,注册code_push账号:
code-push register 
 提示输入key，并弹出网页





在这里我选择关联github账户



拿到key输入并提示登录code_push成功



相关命令
code-push login 登陆     

code-push logout 注销  (注销后会删除本地保存的session,再次登录会进网页重新生成key)

列出登陆的token
code-push access-key rm <accessKye> 删除某个 key值

添加删除App命令:

code-push app
b2f5
add 添加一个app
code-push app remove 在账号中移除一个app
code-push app rename 重命名一个已存在的app
code-push app list ls  列出账号下面所有的app
code-push app transfer 把app的所有权转移到另外的账户

添加一个app
code-push app add MyApp-Android



下面我们创建一个react-native项目并完成code-push配置
首先创建项目
react-native init TestPush 创建完成进入TestPush根目录
然后安装code-push插件
npm install --save react-native-code-push



安装rnpm 执行命令  npm i -g rnpm 
然后再链接插件
rnpm link react-native-code-push  这条命令将会自动帮我们在anroid文件中添加好设置。
包括如下配置{ 
在app的build.gradle中会自动添加
applyfrom:"../../node_modules/react-native-code-push/android/codepush.gradle” 
compile project(':react-native-code-push’)
在app settings.gradle中会自动添加
include ':react-native-code-push'
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app’)
}

接着运行code-push deployment ls MyApp-Android -k 获取密匙



打开android中MainApplication文件添加 CodePush配置
这里如果没用as编译器，CodePush是没有自动import的
需要手动import com.microsoft.codepush.react.CodePush; 



接着把android版本号改为1.0.0, code-push必须用三位数的版本号



到此为止，配置已经完成了.

下面我们利用code-push做热更新.
首先在js中引入code-push

最简单的方式是在根component中进行上述策略控制。

在 js中加载 CodePush模块：

import codePush from 'react-native-code-push'

2.在 componentDidMount中调用 sync方法，后台请求更新

codePush.sync()

接着我们运行android项目
react-native run-android   



手机上会显示welcome



我们随便修改一下



在项目目录下建一个bundles文件夹  mkdir bundles 
打包js文件

react-native bundle --platform android --entry-file index.android.js --bundle-output ./bundles/index.android.bundle --dev true



用code-push发布更新
code-push release MyApp-Android ./bundles/index.android.bundle 1.0.0 --description "初次更新" --mandatory true



之前我已经上传过一份了所以上传重复的会出错。第一次上传肯定ok的。

设置手机不通过本机服务器或许js文件.打开dev-setting — debugging — 点开debug server host &port for device  随便输入一串字符，不让它获取本机js服务器代码

然后手机会从code-push服务器拉取更新，测试成功，更新结果如下: 
后续我将自建code-push服务器做热更新。