React-Native 热部署热更新

CodePush 是提供给 React Native 和 Cordova 开发者直接部署移动应用更新给用户设备的云服务。CodePush 作为一个中央仓库，开发者可以推送更新到 (JS, HTML, CSS and images)，应用可以从客户端 SDKs 里面查询更新。CodePush 可以让应用有更多的可确定性，也可以让你直接接触用户群。在修复一些小问题和添加新特性的时候，不需要经过二进制打包，可以直接推送代码进行实时更新。

CodePush 可以进行实时的推送代码更新：

*直接对用户部署代码更新

*管理 Alpha，Beta 和生产环境应用

*支持 Cordova 和 React Native

官方对Code-push的介绍

CodePush is a cloud service that enables Cordova and React Native developers to deploy mobile app updates directly to their users’ devices. It works by acting as a central repository that developers can publish certain updates to (e.g. JS, HTML, CSS and image changes), and that apps can query for updates from (using our provided client SDKs). This allows you to have a more deterministic and direct engagement model with your end-users, while addressing bugs and/or adding small features that don’t require you to re-build a binary and/or re-distribute it through any public app stores.

一、环境准备

1.安装Code-push cli

$ npm install -g code-push-cli

2、注册CodePush账户

$ code-push register

执行以上命令将会自动打开如下图所示的注册页面：

注册页面

本文使用GitHub账户进行注册，注册成功后将会生成如下图所示相应的access token：

access token

在终端输入刚生成的access token：

3、添加CodePush应用

$ code-push app add XXX //xxx 为你要热部署的app name

4、查看应用

成功后我们可以看到有两个发布键值。一个Production是对应生产环境的，二Staging是对应开发环境的。这个值在后面我们集成工程里面要用到。

二、集成code-push 到工程文件

在项目工程安装CodePush，一般有两三种方法。

一种是cocoaPods接入，一种是手动接入，本文采用的是手动接入。

1、cocoaPods

// 新增

pod'CodePush', :path =>'./node_modules/react-native-code-push'

// 安装

pod install

2、手动接入

1）在命令行下，进入整个工程的根目录，安装CodePush。

npm install"react-native-code-push"--save

2）引入工程

此处有两种方法：

将react-native-code-push文件夹中 CodePush.xcodeproj 直接拉入项目中Libraries中

将

Libraries/CodePush.xcodeproj/Products

中的

libCodePush.a

直接拖入 Link Binary With Libraries中

点击Link Binary With Libraries的加号，选择

libz.tbd

加入

在Build Settings的Header Search Paths那一项中加入

$(SRCROOT)/../node_modules/react-native-code-push

当然上面是一种蠢方法。[doge]，下面是便捷的一键做法。

b npm install 安装以后

直接使用rnpm神器

安装

$ npm -g install rnpm xcode

使用

rnpm link

然后就省略了a步骤那么多步操作，是不是很简单，一步步按a做完的，看到这是不是很想打人。哈哈。

三修改oc代码

1.在加载 js bundle的类中修改代码

修改代码

#import"CodePush.h"

NSURL *jsCodeLocation;

#ifdef DEBUG

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

#else

jsCodeLocation = [CodePush bundleURL];

#endif

2.修改info.plist 添加CodePushDeploymentKey键值对，Deployment Key可以通过以下命令进行获取：(还可以获取热部署后，包更新的详情)。