Creating a React Native Library with CocoaPod Dependencies

React Native has fundamentally transformed the landscape of mobile application development, offering a seamless bridge between the performance of native platforms and the rapid development cycles of JavaScript. Taking a step further into this innovative ecosystem, creating your own React Native library not only enriches your development experience but also significantly contributes to the community, enabling others to leverage your work in their projects.

In this post, we'll walk through the process of using react-native-builder-bob to scaffold a React Native library, complete with an example app, and how to include other dependencies.

React-Native-Builder-Bob

react-native-builder-bob is a handy tool that simplifies the process of creating and configuring a new React Native library. It provides a range of templates and configurations out of the box, making your development process smoother and faster.

Setting Up Your Library

Start by installing react-native-builder-bob globally:

npm install -g react-native-builder-bob

Create a new directory for your library and navigate into it. Run:

npx create-react-native-library my-react-native-library

Replace my-react-native-library with your desired library name. Follow the prompts to scaffold your library with the necessary structure, including an example app.

Including Other Dependencies

Your React Native library might depend on other packages, including native modules. For instance, if you want to include a CocoaPod, you can modify the .podspec file included in the root directory of the library (swift package dependencies are not supported).
Open the .podspec file and add your CocoaPod dependency as in the line below (beware, the pod should be published under CocoaPods Trunk):

s.dependency 'SomeCocoaPod', '~> version'

For Android, dependencies are managed in the build.gradle file within your library's android folder. Add your required Android dependencies, like this:

dependencies {
 implementation 'com.some.android.library:library-name:version'
}

Integrating with the Example App

To test your library with these dependencies, integrate them into the example app that comes with your library scaffold. Update the package.json and Podfile in your example app to include and link these dependencies.

One important, and perhaps not so straightforward, step in the iOS development process involves modifying the library source. Initially, the iOS folder contains just three files with a dummy function that shows you how to expose methods.

You might wonder, "Why isn’t there an Xcode project here? How will I use my included dependencies (pods)?"

Instead of modifying the code directly in the root iOS folder, navigate to the iOS example app. If necessary, run pod install to install the dependencies declared in the .podspec file.

Next, open the .xcworkspace file in Xcode. In the Xcode environment, look for the Pods Target, and within the Development Pods folder, locate your library. Modify the Swift code there. Any modifications you make in this location should also be reflected in the original iOS source folder.

Use the example app to test your library's functionality. Make sure to test on both iOS and Android platforms if your library is cross-platform. This step ensures that your library and its dependencies work as expected.

Building your React Native library using react-native-builder-bob not only simplifies the development process but also enriches the React Native ecosystem with your unique contributions. Remember, the success of your library hinges on its integration with the ecosystem and its adaptability to evolving trends in mobile development.

As you share your library and gather feedback, you're not just enhancing your project; you're also contributing to the vibrant community of React Native developers. Stay engaged, keep innovating, and happy coding!