Create multiple Cxx TurboModules in same package

[mbpictures]

Hi!

I have a npm package with multiple cross-platform C++ modules, but on android, the second one fails to link.

My structure:

• src
  • specs
    • NativeA.ts
    • NativeB.ts
  • other.ts
• cpp
  • NativeATurboModule.h
  • NativeATurboModule.cpp
  • NativeBTurboModule.h
  • NativeBTurboModule.cpp
• android
  • CMakeLists.txt

react-native.config.js:

module.exports = {
    dependency: {
        platforms: {
            android: {
                cxxModuleCMakeListsModuleName: 'A',
                cxxModuleCMakeListsPath: 'CMakeLists.txt',
                cxxModuleHeaderName: 'NativeATurboModule',
            },
        },
    },
};

I think as NativeATurboModule is defined as cxxModuleHeaderName, that's the reason only the A module is linked? When I check the the autolinking.cpp, I can find this line:

std::shared_ptr<TurboModule> autolinking_cxxModuleProvider(const std::string moduleName, const std::shared_ptr<CallInvoker>& jsInvoker) {
if (moduleName == NativeATurboModule::kModuleName) {
return std::make_shared<NativeATurboModule>(jsInvoker);
}
  return nullptr;
}

But in the locally generated codegen folder of the package, I can also find this one (inside the RNModuleNameSpec-generated.cpp):

std::shared_ptr<TurboModule> RNMultiTrackPlayerSpec_ModuleProvider(const std::string &moduleName, const JavaTurboModule::InitParams &params) {
  if (moduleName == "A") {
    return std::make_shared<NativeASpecJSI>(params);
  }
  if (moduleName == "B") {
    return std::make_shared<NativeBSpecJSI>(params);
  }
  return nullptr;
}

Does anyone know how to add multiple C++ TurboModules in an npm package? I think I can merge all the definitions, but this would result in a really large and kinda messy module...

[cortinico]

Does anyone know how to add multiple C++ TurboModules in an npm package? I think I can merge all the definitions, but this would result in a really large and kinda messy module...

This is sadly not supported at the moment. As we need to generate a lot of C++ code for this to work, the initial implementation of Autolinking for pure C++ TM, was done under the assumption that there would be one module per NPM package.

You should create a separate package for NativeA and NativeB as they will generate separate module provider and need to be both autolinked.

The react-native.config.js file also allows for a single module and not an array of them.

[mbpictures]

Thanks for your answer! I think I managed to have two native cxx modules in one package. What I did:

• Create a OnLoad.cpp inside my main react-native app (android/app/src/main/jni/OnLoad.cpp)
• Create a CMakeLists.txt file (android/app/src/main/jni/CMakeLists.txt)
• Register the CMakeLists.txt file in the apps gradle file (android/app/build.gradle):

   externalNativeBuild {
        cmake {
            path "src/main/jni/CMakeLists.txt"
        }
    }

• Update the cxxModuleProvider Function of the OnLoad.cpp:

std::shared_ptr<TurboModule> cxxModuleProvider(
    const std::string& name,
    const std::shared_ptr<CallInvoker>& jsInvoker) {
  // Here you can provide your CXX Turbo Modules coming from
  // either your application or from external libraries. The approach to follow
  // is similar to the following (for a module called `NativeCxxModuleExample`):
  //
  // if (name == NativeCxxModuleExample::kModuleName) {
  //   return std::make_shared<NativeCxxModuleExample>(jsInvoker);
  // }
  if (name == NativeATurboModule::kModuleName) {
    return std::make_shared<NativeATurboModule>(jsInvoker);
  }
  if (name == NativeBTurboModule::kModuleName) {
    return std::make_shared<NativeBTurboModule>(jsInvoker);
  }

  return autolinking_cxxModuleProvider(name, jsInvoker);
}

As the npm package with the two native modules is internal only, this is a feasible workaround for us! Maybe it helps someone else, too. Or do you think this is bad practice in some kind?

[cortinico]

As the npm package with the two native modules is internal only, this is a feasible workaround for us! Maybe it helps someone else, too. Or do you think this is bad practice in some kind?

That's totally doable, as you're practically not using autolinking but linking the module manually.

The only problem I see is that your NPM package won't work with other apps in the future if you plan to distribute it (unless you explain your users to do the same steps you did in your app).

[mensonones]

hey, @cortinico

Writing native modules with C++ is only available from React Native version 0.76?