React Native Realm app Crash after release build - reactjs

Question

I've just setup a clean fresh react-native app (not expo). Made it ready for release and it's working fine, the apk is installing fine on my phone. Realm package install from here https://www.npmjs.com/package/#realm/react. I have setup the working example from the #realm/react. In debug mode, it works fine. After i run npx react-native run-android --variant=release, it builds and installs the release apk , but instant app crash. If i comment out all the realm functions, it works. This is the error:
Error: Exception in HostObject::get for prop 'Realm': java.lang.UnsatisfiedLinkError: couldn't find DSO to load: librealm.so caused by: io.realm.react.util.SSLHelper result: 0, js engine: hermes, stack:
anonymous#1:1140678
loadModuleImplementation#1:36194
guardedLoadModule#1:35743
metroRequire#1:35371
anonymous#1:1140455
loadModuleImplementation#1:36194
guardedLoadModule#1:35743
metroRequire#1:35371
anonymous#1:1138421
loadModuleImplementation#1:36194
guardedLoadModule#1:35743
metroRequire#1:35371
anonymous#1:935016
loadModuleImplementation#1:36194
guardedLoadModule#1:35743
metroRequire#1:35371
anonymous#1:901819
loadModuleImplementation#1:36194
guardedLoadModule#1:35743
metroRequire#1:35371
anonymous#1:42538
loadModuleImplementation#1:36194
guardedLoadModule#1:35700
metroRequire#1:35371
global#1:34955
at com.facebook.react.modules.core.ExceptionsManagerModule.reportException(Unknown Source:75)
at java.lang.reflect.Method.invoke(Native Method)
at com.facebook.react.bridge.JavaMethodWrapper.invoke(Unknown Source:148)
at com.facebook.react.bridge.JavaModuleWrapper.invoke(Unknown Source:147)
at com.facebook.jni.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:938)
at android.os.Handler.dispatchMessage(Handler.java:99)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(Unknown Source:0)
at android.os.Looper.loopOnce(Looper.java:210)
at android.os.Looper.loop(Looper.java:299)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(Unknown Source:37)
at java.lang.Thread.run(Thread.java:1012)
App.js
import React, {useState} from 'react';
import {View, Text, TextInput, Pressable} from 'react-native';
import {Realm, createRealmContext} from '#realm/react';
class Task extends Realm.Object {
_id!: Realm.BSON.ObjectId;
description!: string;
isComplete!: boolean;
createdAt!: Date;
static generate(description: string) {
return {
_id: new Realm.BSON.ObjectId(),
description,
createdAt: new Date(),
};
}
static schema = {
name: 'Task',
primaryKey: '_id',
properties: {
_id: 'objectId',
description: 'string',
isComplete: {type: 'bool', default: false},
createdAt: 'date',
},
};
}
const {RealmProvider, useRealm, useQuery} = createRealmContext({
schema: [Task],
});
export default function AppWrapper() {
return (
<RealmProvider>
<TaskApp />
</RealmProvider>
);
}
function TaskApp() {
const realm = useRealm();
const tasks = useQuery(Task);
const [newDescription, setNewDescription] = useState('');
console.log(tasks);
return (
<View>
<View
style={{flexDirection: 'row', justifyContent: 'center', margin: 10}}>
<TextInput
value={newDescription}
placeholder="Enter new task description"
onChangeText={setNewDescription}
/>
<Pressable
onPress={() => {
realm.write(() => {
realm.create('Task', Task.generate(newDescription));
});
setNewDescription('');
}}>
<Text>➕</Text>
</Pressable>
</View>
<View style={{backgroundColor: 'red', height: 100}}>
{tasks &&
tasks.map(i => <Text key={i.createdAt}>{i.description}</Text>)}
</View>
</View>
);
}
package.json
{
"name": "poiTourist",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"lint": "eslint .",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"#realm/react": "^0.4.3",
"react": "18.2.0",
"react-native": "0.71.3",
"react-native-get-random-values": "^1.8.0",
"realm": "^11.4.0"
},
"devDependencies": {
"#babel/core": "^7.20.0",
"#babel/preset-env": "^7.20.0",
"#babel/runtime": "^7.20.0",
"#react-native-community/eslint-config": "^3.2.0",
"#tsconfig/react-native": "^2.0.2",
"#types/jest": "^29.2.1",
"#types/react": "^18.0.24",
"#types/react-test-renderer": "^18.0.0",
"babel-jest": "^29.2.1",
"eslint": "^8.19.0",
"jest": "^29.2.1",
"metro-react-native-babel-preset": "0.73.7",
"prettier": "^2.4.1",
"react-test-renderer": "18.2.0",
"typescript": "4.8.4"
},
"jest": {
"preset": "react-native"
}
}
For the past 2 days I've been trying yo get to the source of the problem but no results. With a fresh new install still the same resposne (instant app crash after app build and app install). After some google search I found that realm and hermes was an issue, but not with the last version. Another issue was with react-native-reanimated, but in this fresh project I dont have it. Any solutions? Cheers in advance.
-new fresh rn install,
-followed instructions from official realm docs and rn docs

Answer 1

Ok, So I have manage to fix this. In my case I was not paying attention to all the prerequsitis that realm is providing. The most important https://github.com/realm/realm-js/blob/master/COMPATIBILITY.md Thanks for help