Is that possible to add react-native modules to manages workflow?

How to / Third Party Tooling
1

Hi all,
I’m new and I have a question about adding react-native modules.
For example, is that possible to use react-native-sms in the managed workflow without ejecting?
Thanks,

2

Hi @ussahand

The short answer is “yes”.

A few months ago the answer would have been “you can install react native modules (or other JavaScript modules) in a Managed app as long as those modules do not contain native code, except if the module is already included in the Expo SDK.”

So for example, you could always make use of things like react-native-svg, because even though it makes use of native code, it is included in the Expo SDK. But you could not use react-native-sms in a Managed app.

The above is still true when talking about the “classic” build system (expo build:android, expo build:ios) and with the Expo Go app.

These days the answer is better, but is a bit more complicated to explain.

If you use EAS Build (which is still in Preview, but works well) you can install things like react-native-sms. But if you do install a module that requires native code that is not already part of the Expo SDK, then instead of using the Expo Go app during development you will need to build a Custom Dev Client. This is basically like a version of Expo Go that is customised to include only the native code required by the dependencies that you have installed, instead of the native code required by everything in the Expo SDK.

Like the custom dev client, when you build the production version of your app with EAS Build it also only includes the code for the dependencies that you have installed instead of whatever is included in the Expo SDK. This means that you can use things like react-native-sms that makes use of native code, and it also means that your app is smaller than it would have been if built with expo build, because it doesn’t include things like e.g. the Facebook SDK or the face detector, etc. if it doesn’t use those.

However, when you install a module that depends on native code you will often see in the instructions stuff about having to edit code under the android or ios directories. In a Managed Expo app these directories don’t exist. EAS Build actually creates these during the build process using expo prebuild. (See the Android and iOS build process docs if you’re interested in what goes on under the hood during the build)

If the module requires you to edit things under android or ios then in order to allow expo prebuild to make those customisations for you during the build there needs to be a Config Plugin which makes those changes.

Hopefully the authors of react native modules will write config plugins themselves so that they will automatically work in managed Expo apps when built with EAS Build. There are a few projects that already have config plugins built in. But because EAS Build and config plugins are still new, most react native modules do not yet have them. If you want to use one of these, you’ll have to write the config plugin yourself.

react-native-sms has not been updated in a couple of years, so it doesn’t even mention React Native 0.60 and autolinking. (react-native link is deprecated.) So it definitely doesn’t have a config plugin built in. If you want to install it, you’ll need to write a config plugin.

Instead of react-native-sms you might be able to use Linking to do what you want. e.g. see the following:

1 Like
3

Thanks @wodin for your complete explanation :pray:

1 Like