React Native 热更新

• 工具
• 服务端配置
• 安装mysql数据库
• 源码安装 code-push-server
• 配置文件
• 运行
• 客户端配置
• 安装命令行工具
• 登录code-push-server服务器
• 创建 app
• App中添加code-push
  • 安装SDK
  • 配置Deployment Key参数
  • iOS配置加载路径
  • 添加检查更新代码
• 发布更新包

工具

服务端（CentOS）	客户端 （App端）
code-push-server	react-native-code-push

服务端配置

code-push-server用来作热更新的服务器，它需要机器上提前安装mysql数据库。

安装mysql数据库

$ sudo yum install -y mysql-server mysql mysql-devel

源码安装 code-push-server

$ git clone https://github.com/lisong/code-push-server.git
$ cd code-push-server
$ npm install
// 初始化数据库
$ ./bin/db init --dbhost localhost --dbuser root --dbpassword

配置文件

// 注意要修改相应的参数
code-push-server配置文件：config.js、

// 注意要修改相应的参数
pm2守护进程配置文件：process.json

运行

// 独立运行
$ CONFIG_FILE=config.js PORT=8030 HOST=0.0.0.0 NODE_ENV=production code-push-server/bin/www

// 守护进程运行
$ pm2 start process.json

客户端配置

安装命令行工具

$ npm install -g code-push-cli

登录code-push-server服务器

浏览器访问 刚才部署的 code-push-server服务器 ，登录并获取 token

// 输入上面获取的`token`
$ code-push login http://YOUR_CODE_PUSH_SERVER:8030

创建 app

// 创建后会生成相应 Staging、Production 的 Deployment Key；
// 这个Key接下来需要配置在iOS/Android工程里面
$ code-push app add {App名称}-ios
$ code-push app add {App名称}-android

// 查看你app的配置key
$ code-push deployment ls {App名称}-ios -k

┌────────────┬─────────────────────────────┐
│ Name │ Deployment Key │
├────────────┼─────────────────────────────┤
│ Production │ YoGhxhMWmi72nDdFr3F24kQQSMVx4yoYaYChf │
├────────────┼─────────────────────────────┤
│ Staging │ y8LZUAILNMCa4C6f5N3XwAlaAROe4yoYaYChf │
└────────────┴─────────────────────────────┘

App中添加code-push

安装SDK

// 进到你的react-native项目
$ npm install --save react-native-code-push@latest

注意：如果你是在现有的native项目集成的react-native，需要修改你native项目中的Podfile：

pod 'CodePush', :path => '{你的react-native项目目录}/node_modules/react-native-code-push'

然后执行：
$ pod install

配置Deployment Key参数

将上面生成的Deployment Key 配置到iOS项目的Info.plist中，同时需要指定CodePushServerURL参数，如果不指定的话，它会去微软的Code Push服务器去检查更新，因为我们部署了自己的code-push-server服务器，这里配置成我们自己的就可以了。

CodePushDeploymentKey
YoGhxhMWmi72nDdFr3F24kQQSMVx4yoYaYChf
CodePushServerURL
http://YOUR_CODE_PUSH_SERVER:8030/

iOS配置加载路径

// AppDelegate.m
#import 

#ifdef DEBUG
    jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
#else
    jsCodeLocation = [CodePush bundleURL];
#endif

添加检查更新代码

import codePush from "react-native-code-push";

class MyApp extends Component {
}

MyApp = codePush(MyApp);

详情请查阅官方文档

发布更新包

从客户端发布更新包到服务器：

// 进入你的 react-native 项目目录

// 如果你的项目是一个纯的 react-native 项目，则执行：
$ code-push release-react {App名称}-ios ios

// 如果你是在现有native项目中集成的 react-native，则执行
$ code-push release-react {App名称}-ios ios --plistFile={你的native项目目录}/Info.plist

// 上面2条命令默认发布到 `Staging`环境，如果想发布到`Production`环境，需跟上参数：
$ -d Production

// 查看你app的配置key、已发布的更新包
$ code-push deployment ls {App名称}-ios -k