React Native 0.40 Upgrading iOS Native Modules

Help! My Module is Broken

You may have received an error message like the one below when trying to use an older React Native iOS module in the latest React Native >= 0.40.

"Duplicate interface definition for class "'RCTView'"

If you're native module was created prior to React Native version 0.40 you'll need to upgrade your module to work with the latest version of React Native.

After e1577df, Native code on iOS must refer to headers out of the react namespace. - React Native 0.40 Release Notes

How Do I Fix It?

  1. Fork the component into your own repo.
  2. Open the ios/ProjectName folder in your new repo.
  3. Look through all the .m and .h files and commit the changes described below to any occurrence of an import with the RCT (RCT stands for React) prefix.
  4. Now you can replace the package.json value for that component with the Github URL of your updated component in any project you want to use your fixed version of the component in.
  5. Be an awesome person and create a pull request on the source repo to help out the community!

Only support latest React Native:

// change this:
#import "RCTView.h"

// to this:
#import <React/RCTView.h>

Why would you want to only support the latest? @edmundito brings up some good points on this thread:

I'm happy either way, and I've been tracking other dependent modules that need to be updated to 0.40, and there's a general pattern that I'm ok with:

  1. Make changes without backward compatible support
  2. Bump the minor number
  3. Update the README to denote what version is compatible with 0.39 or below.

Not recommended but if you need your module to work on both versions you can use this backwards compatible fix:

#if __has_include(<React/RCTView.h>)
  #import <React/RCTView.h>
#elif __has_include("RCTView.h")
  #import "RCTView.h"
#else
  #import "React/RCTView.h" // Required when used as a Pod in a Swift project
#endif

Resources