React Native Bundle Deployment

React Configuration

1. Install dependencies

   npm install --save @tingyunapp/react-native-tingyunapp

2. Configure Transform

   • If the React Native version is greater than or equal to 0.59, add transformer.babelTransformerPath to the transformer section in the metro.config.js file in the root directory.

   • If the React Native version is 0.57 or 0.58, add transformer.babelTransformerPath to the transformer section in the rn-cli.config.js file in the root directory. Example:

     module.exports = {
       transformer: {
         getTransformOptions: async () => ({
           transform: {
             experimentalImportSupport: false,
             inlineRequires: false,
           },
         }),
         babelTransformerPath: require.resolve('@tingyunapp/react-native-tingyunapp/src/NBSTransformer.js'),
       },
     };

     Note： If the project uses react-native bundle for packaging and has configured the --config parameter, please add transformer.babelTransformerPath to the configured JavaScript file.

   • If the React Native version is less than 0.57, create a rn-cli.config.js file in the project root directory (if it does not exist) and add the following content:

     module.exports = {
       getTransformModulePath() {
         return require.resolve('@tingyunapp/react-native-tingyunapp/src/NBSTransformer.js');
       },
       getSourceExts() {
         return ['js'];
       }
     }

     Note： If the project uses react-native bundle for packaging and has configured the --config parameter, please add getTransformModulePath to the configured JavaScript file.

Android Native Project Configuration

For React Native versions below 0.60, the SDK bridge method classes may not be packaged into the APK. You can solve this by:

Copying the SDK bridge classes to the Android Native project.

Copy the RNReactNativeTingyunappModule.java and RNReactNativeTingyunappPackage.java classes from the node_modules\@tingyunapp\react-native-tingyunapp\android\src\main\java\com\tingyun\app directory to the Native project.

When defining the ReactNativeHost object, add the Tingyun ReactPackage.

private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new com.tingyun.app.RNReactNativeTingyunappPackage()//Add the Tingyun ReactPackage
      );
    }

    @Override
    protected String getJSMainModuleName() {
      return "index";
    }
};