React Native打包（二：react-native集成友盟)

本文主要是介绍React Native打包（二：react-native集成友盟)，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

（一）前言
版本环境

node 8.0+(v8.12.0)
npm 5.0+(v6.4.1)
java (v1.8.0_172)"react-native": "0.57.1","react": "16.5.0",

参考链接博客

（二）. ##集成安卓环境##

1. 在android/app/build.gradle

dependencies {....implementation "com.facebook.react:react-native:+"  // From node_modulesimplementation 'com.umeng.analytics:analytics:latest.integration' // umeng
}

2. 如果无法正常集成请在android/build.gradle 添加如下代码 ：

allprojects {repositories {google()mavenLocal()jcenter()maven {// All of React Native (JS, Obj-C sources, Android binaries) is installed from npmurl "$rootDir/../node_modules/react-native/android"}// react-native-image-crop-pickermaven { url 'https://maven.google.com' }// react-native-image-crop-pickermaven { url "https://jitpack.io" }// umeng  mavenCentral() }
}

重新build应用，Gradle就会将上述配置的sdk自动下载到本地。

3. 配置android/app/src/main/AndroidManifest.xml

<manifest……>
……
<activity ……/><activity android:name="com.facebook.react.devsupport.DevSettingsActivity" /><!--umeng--><meta-data android:value="YOUR_APP_KEY" android:name="UMENG_APPKEY"/><meta-data android:value="Channel ID" android:name="UMENG_CHANNEL"/>
</application>    
</manifest>

4. 配置android/app/src/main/java/com/项目名/MainActivity.java

// umeng
import com.umeng.analytics.MobclickAgent;...
// Umeng sdk
public void onResume() {super.onResume();MobclickAgent.onResume(this);
}
public void onPause() {super.onPause();MobclickAgent.onPause(this);
}

（三）. ##集成IOS环境##

1. 在pod增加依赖

target '项目名' do# react-native-image-crop-picker setup -----># this is very important to have!rn_path = '../node_modules/react-native'pod 'yoga', path: "#{rn_path}/ReactCommon/yoga/yoga.podspec"pod 'React', path: rn_path, subspecs: ['Core','RCTActionSheet','RCTAnimation','RCTGeolocation','RCTImage','RCTLinkingIOS','RCTNetwork','RCTSettings','RCTText','RCTVibration','RCTWebSocket','ART', # react-native-progress]
# umeng 标准SDK，含IDFA  ----->pod 'UMengAnalytics'
# <-----  标准SDK，含IDFApod 'RNImageCropPicker', :path =>  '../node_modules/react-native-image-crop-picker'
# <----- react-native-image-crop-picker setupend

然后 cd ios && pod install 安装sdk

2. 设置配置

在AppDelegate.m文件

#import "UMMobClick/MobClick.h" // <--- import umeng - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{UMConfigInstance.appKey = @"YOUR_APP_KEY";UMConfigInstance.channelId = @"Channel ID";// UMConfigInstance.eSType = E_UM_GAME; // 仅适用于游戏场景，应用统计不用设置[MobClick setAppVersion: XcodeAppVersion]; // 配置umeng app版本[MobClick startWithConfigure:UMConfigInstance]; // 配置以上参数后调用此方法初始化SDKNSURL *jsCodeLocation;...
}

（四）. ##结论##

基础环境配置完成，但是目前友盟app_key写死在配置文件中，后续多环境打包会提供方案解决

这篇关于React Native打包（二：react-native集成友盟)的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---