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_modules
    implementation '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 npm
            url "$rootDir/../node_modules/react-native/android"
        }

        // react-native-image-crop-picker
        maven { url 'https://maven.google.com' }

        // react-native-image-crop-picker
        maven { 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，含IDFA
  pod 'RNImageCropPicker', :path =>  '../node_modules/react-native-image-crop-picker'
# <----- react-native-image-crop-picker setup

end

然后 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]; // 配置以上参数后调用此方法初始化SDK
  NSURL *jsCodeLocation;
  ...
}

（四）. ##结论##

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