[ReactNative集成CodePush教程][二] 集成Code Push到项目工程里

前端之家收集整理的这篇文章主要介绍了[ReactNative集成CodePush教程][二] 集成Code Push到项目工程里前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ReactNative集成CodePush教程集合

[一] 注册CodePush准备工作

[二] 集成Code Push到项目工程里

[三] 集成Code Push的案例说明

转载请保留出处:http://blog.csdn.net/mad2man



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

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


一. cocoaPods 引入(可选)

修改Podfile文件
1
2
3
4
5
// 新增
pod 'CodePush' ,:path => './node_modules/react-native-code-push'
// 安装
pod install

二 . 手动引入(本文采用方法

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

使用npm安装
1
npm install "react-native-code-push" --save

2. 安装完毕后,可以根据package.json来查看是否正确安装了。

3. 用XCode打开iOS工程文件,然后将node_module/react-native-code-push/ios/CodePush.xcodeproj 这个文件拖进工程文件的Libraries文件夹下。

4. 进入工程的target,选择"Build Phases",然后添加静态库 libCodePush.a,以及libz.tbd。

5. 添加完毕后,到“build Setting”选项卡里,修改“Header Search Paths”的目录,添加多一个路径:

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

以上的操作,即可成功集成CodePush。


三. 更改代码

在Appdelegate.m文件里面,将jscode加载的位置修改成由CodePush来指定。

Appdelegate.m
1
2
3
4
5
6
7
#import "CodePush.h"

NSURL *jsCodeLocation;
#ifdef DEBUG
jsCodeLocation = [NSURL URLWithString:@ "<a href="http://localhost:8081/index.ios.bundle?platform=ios&dev=true" "="" style="text-decoration: none; color: rgb(157,159) !important; border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; border-bottom-left-radius: 0px !important; background-image: none !important; border: 0px !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; line-height: 20px !important; margin: 0px !important; outline: 0px !important; overflow: visible !important; padding: 0px !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; width: auto !important; Box-sizing: content-Box !important; min-height: inherit !important;">http://localhost:8081/index.ios.bundle?platform=ios&dev=true" ];
#else
jsCodeLocation = [CodePush bundleURL];
#endif

修改info.plist文件

在info.plist文件中,添加多一个键值,CodePushDeploymentKey,然后值对应为已经注册号的应用的Production或者Staging的Deployment Key。

修改JS代码

在需要启动代码更新的位置里面,引用CodePush,并且调用Code Push的更新接口。

这里我们一般选择的 componentDidMount() 这个方法里面。

热更新代码
1
2
3
4
5
6
7
8
9
10
// Import the JavaScript module for CodePush:
import codePush from "react-native-code-push" ;
// Call the sync method from within the componentDidMount lifecycle event,to initiate a background update on each app start:

codePush.sync();

到这里为止,我们已经成功引入了CodePush,并且接入了更新代码。接下来我们使用一个案例来测试说明。

原文链接:https://www.f2er.com/react/306922.html

猜你在找的React相关文章