Expo has upgraded their modules strategy, why you can read here and replace the package react-native-unimodules with expo package. In this article you can read how to migrate from the old react-native-unimodules to the brand new Expo modules wth the expo package.
Note that the react-native-unimodules had some evolution in the past as well, some code changes could look a little but different. Your app name could be different; myapp is used in the examples below
Remove react-native-unimodules
- Remove react-native-unimodules from the package.json (
npm uninstalloryarn remove)
iOS
- Remove the import and use of react-native-unimodules in
ios/Podfileand runnpx pod-install
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
- require_relative '../node_modules/react-native-unimodules/cocoapods.rb'
target 'MyApp' do
- use_unimodules!
config = use_native_modules!
- Remove react-native-unimodules references from
ios/MyApp/AppDelegate.h
- #import <UMCore/UMAppDelegateWrapper.h>
- @interface AppDelegate : UMAppDelegateWrapper <UIApplicationDelegate, RCTBridgeDelegate, UNUserNotificationCenterDelegate>
+ @interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate, UNUserNotificationCenterDelegate>
- Remove react-native-unimodules references from
ios/MyApp/AppDelegate.m
- #import <UMCore/UMModuleRegistry.h>
- #import <UMReactNativeAdapter/UMNativeModulesProxy.h>
- #import <UMReactNativeAdapter/UMModuleRegistryAdapter.h>
- @interface AppDelegate () <RCTBridgeDelegate>
- @property (nonatomic, strong) UMModuleRegistryAdapter *moduleRegistryAdapter;
- @end
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
- self.moduleRegistryAdapter = [[UMModuleRegistryAdapter alloc] initWithModuleRegistryProvider:[[UMModuleRegistryProvider alloc] init]];
- [super application:application didFinishLaunchingWithOptions:launchOptions];
return YES;
}
- - (NSArray<id<RCTBridgeModule>> *)extraModulesForBridge:(RCTBridge *)bridge
-{
- NSArray<id<RCTBridgeModule>> *extraModules = [_moduleRegistryAdapter extraModulesForBridge:bridge];
- // If you'd like to export some custom RCTBridgeModules that are not Expo modules, add them here!
- return extraModules;
-}
@end
Android
- Remove react-native-unimodules from
android/app/build.gradle
apply plugin: "com.android.application"
- apply from: '../../node_modules/react-native-unimodules/gradle.groovy'
dependencies {
- addUnimodulesDependencies()
}
- Remove link to react-native-unimodules from
android/settings.gradle
rootProject.name = 'MyApp'
- apply from: '../node_modules/react-native-unimodules/gradle.groovy';
- includeUnimodulesProjects()
- Remove reference of react-native-unimodules in
android/app/src/main/java/com/myapp/MainApplication.java
- import com.myapp.generated.BasePackageList;
- import java.util.Arrays;
- import org.unimodules.adapters.react.ModuleRegistryAdapter;
- import org.unimodules.adapters.react.ReactModuleRegistryProvider;
public class MainApplication extends Application implements ReactApplication {
- private final ReactModuleRegistryProvider mModuleRegistryProvider = new ReactModuleRegistryProvider(new BasePackageList().getPackageList(), null);
private final ReactNativeHost mReactNativeHost =
new ReactNativeHost(this) {
@Override
protected List<ReactPackage> getPackages() {
@SuppressWarnings("UnnecessaryLocalVariable")
List<ReactPackage> packages = new PackageList(this).getPackages();
// Packages that cannot be autolinked yet can be added manually here, for example:
// packages.add(new MyReactNativePackage());
- // Add unimodules
- List<ReactPackage> unimodules = Arrays.<ReactPackage>asList(
- new ModuleRegistryAdapter(mModuleRegistryProvider)
- );
- packages.addAll(unimodules);
return packages;
}
};
}
- Remove the generated package list file located at
android/app/src/main/java/com/myapp/generated/BasePackageList.java
Update Expo SDK packages
If you already have Expo SDK packages installed like expo-calendar, as I had, you need to update those to the latest version as well. Check your package.json to see which Expo SDK packages are there, set them to the latest version and run npm or yarn.
Add Expo modules
Now we removed the old react-native-unimodules and updated the Expo SDK packages we can install the new Expo modules.
Automatic install
Expo made a great tool to add the Expo package and adjust all the native files: npx install-expo-modules
I would recommend this to use for adding the Expo modules. Beacuse we removed the old react-native-unimodules it should work for most projects. If not and it fails or you cannot build the project you can try the manual instalation
Manual install
Expo has an in detailed description how to add Expo modules the manual way. Just modify all the named files and it should be ok.
Update imports in Typescript/Javascript
The old react-native-unimodules, and the new Expo moduels as well, included some Expo SDK packages like expo-application, expo-constants and 'expo-file-system'.
You need to migrate the one you imported from react-native-unimodules to now use the real Expo SDK package name and imports. For example if we used Expo constants we need to change the code below:
- import { Constants } from 'react-native-unimodules';
+ import Constants from 'expo-constants';
Top comments (7)
Will this work on React Native CLI as well?
currently I have an app that uses expo-camera which uses unimodules and I can't upgrade expo-camera ^11.2.2, above this ver to the latest ver gives me an error so I am stuck with this one for now.
just tried migrating and upgrading my camera and it does work but I'm just having error with expo camera
initBarcodeScanner$lamda-3(...) must not be null
update: I found out now what's causing this error. Installing expo-barcode-scanner solves the error.
What was your expo version?
Migrated from react-native-unimodules 0.14.8 to expo (modules) 43.0.4
I am having trouble with AppDelegate file. If you could please share what you changed in it. Thanks for the article.
Some lines starting with the dash are red, and some white. Which should I remove? Especially in the AppDelegate.m file it is impossible for me to guess :)
Thank you.
Thanks, I had somehow missed removing "" from my code and my build was failing. This helped me confirm I could just yank it out and move on :).