Bare Expo Setup for web and mobile

General040642add70aa006ef56b5af5b5acae3
1

My goal is to create a video conferencing app that runs on web and android. Ideally, I could use a bare expo app and the react-native-webrtc-web-shim to have (almost) 1 code base for this.

However, I cannot get even a simple bare expo app to run.

Recreation Steps:

  • I have created a clean bare expo project using expo init
  • Follow instructions to add config-plugin
  • app.json now includes "plugins": ["@config-plugins/react-native-webrtc"] as per instructions
  • Bumped minSdkVersion from ‘21’ to ‘24’ to avoid the createEgl14 bug
    so my /android/build.gradle looks like this:
buildscript {
    ext {
        buildToolsVersion = findProperty('android.buildToolsVersion') ?: '31.0.0'
        minSdkVersion = Integer.parseInt(findProperty('android.minSdkVersion') ?: '24')  // <-------
        compileSdkVersion = Integer.parseInt(findProperty('android.compileSdkVersion') ?: '31')
        targetSdkVersion = Integer.parseInt(findProperty('android.targetSdkVersion') ?: '31')

  • Follow android setup instructions updating:
    android/app/src/main/AndroidManifest.xml
    android/app/build.gradle
    android/app/proguard-rules.pro

  • Did NOT add android.enableDexingArtifactTransform.desugaring=false to android/gradle.properties as I am not trying to get screen capture support.

  • In the end, my npm package looked like this:

  "dependencies": {
    "@config-plugins/react-native-webrtc": "^4.0.0",
    "expo": "~46.0.16",
    "expo-dev-client": "^1.3.1",
    "expo-splash-screen": "~0.16.2",
    "expo-status-bar": "~1.4.0",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-native": "0.69.6",
    "react-native-web": "~0.18.7",
    "react-native-webrtc": "^106.0.0-beta.6"
  },

On building the android package and opening on a real device or the android emulator, I get the error

couldn't find DSO to load: libhermes.so
com.facebook.soloader.SoLoader.doLoadLibraryBySoName (SoLoader.java:738)
com.facebook.soloader.SoLoader.loadLibraryBySoName (SoLoader.java:591)
com.facebook.soloader.SoLoader.loadLibrary (SoLoader.java:529)
com.facebook.soloader.SoLoader.loadLibrary (SoLoader.java:484)
com.facebook.hermes.reactexecutor.HermesExecutor. (HermesExecutor.java:20)
com.facebook.hermes.reactexecutor.HermesExecutorFactory.create (HermesExecutorFactory.java:27)
com.facebook.react.ReactInstanceManager$5.run (ReactInstanceManager.java:952)
java.lang.Thread.run (Thread.java:818)

Which appears to be an issue with older versions of react-native

I have tried several version combinations of react, react-native, react-native-webrtc and the config-plugin with no improvement.

  1. Is it possible to create a combination expo/web-shim with a (largely) shared codebase?
  2. What are the compatible versions of react-native, expo and react-native-webrtc?
  3. Ideas to where I went wrong on my installation?
2

As far as I remember, I had similar problems. I found this thread and grabbed a solution from one of the comments. I added a file like this and included it in the app.json plugins:

const { createRunOncePlugin, withAppBuildGradle } = require('@expo/config-plugins');

const withAppBuildGradleModified = config => {
  return withAppBuildGradle(config, async file => {
    const modResults = file.modResults;
    modResults.contents = modResults.contents + '\nandroid.packagingOptions.jniLibs.useLegacyPackaging = true\n';
    return file;
  });
};

module.exports = createRunOncePlugin(
  withAppBuildGradleModified,
  'withAppBuildGradleModified',
  '1.0.0'
);

"plugins": [
        "./expo-plugin/plugin.js",
        "@config-plugins/react-native-webrtc"
]

Perhaps there is a chance it solves your issue, too?

3

Thank you! This addition solved the issue

1 Like
4

Hi, I am having the same issue, but when i use ‘expo prebuild’ i lose all the changes in the buildscript etc. Do you avoid using ‘expo prebuild’?

or can i ask if you don’t mind sending me an example empty project with it working as I think I’m missing something and its driving me crazy. No worries if not.

thanks