React native Question posted in
The official React Native documentation can be found here.

React native – React-Native-worklets-core Error: worklets not found, even though I installed it

So I try to develop an Android app with React-Native that uses the Google ML Kit pose detection. I’m still at the beginning of this project, but my first goal is to start the app and see if the pose detection works. Because of that I need the react-native-vision-camera and the react-native-worklets-core package for the frame processor.
Just to let you know, in App.tsx I use the frame processor like that:

//[...]
 const frameProcessor = useFrameProcessor((frame: any) => {
    'worklet';
    const poseObject = objectDetect(frame);

 //[...]

and included it in the Camera-component in return:

return (
    <>
      <Camera
        frameProcessor={frameProcessor}
        style={StyleSheet.absoluteFill}
        device={device}
        isActive={true}
      />
//[...]

Currently I still work with the emulator of Android Studio.
I did everything as descripted in the directions of React-Native-Vision-Camera and -Worklets-core and the build is always successful but the app gives me the following error code on the emulator:

Uncaught Error

Frame Processors are not available, react-native-worklets-core is not installed! Error: TurboModuleRegistry.getEnforcing(...): 'Worklets' could not be found. Verify that a module by this name is registered in the native binary.
Bridgeless mode: false. TurboModule interop: false. Modules loaded:
{"NativeModules":["PlatformConstants","LogBox","Timing","AppState","SourceCode","BlobModule","WebSocketModule","DevSettings","DevToolsSettingsManager","Networking","Appearance","DevLoadingView","HeadlessJsTaskSupport","UIManager","DeviceInfo","ImageLoader","SoundManager","IntentAndroid","DeviceEventManager","RNGestureHandlerModule","I18nManager","ReanimatedModule"],"TurboModules":[],"NotFound":["NativePerformanceCxx","NativePerformanceObserverCxx","RedBox","BugReporting","LinkingManager","Worklets"]}

The point is: I already installed worklets-core!

My dependencies in package.json:

  "dependencies": {
    "metro-react-native-babel-preset": "^0.77.0",
    "react": "18.2.0",
    "react-native": "0.73.6",
    "react-native-gesture-handler": "^2.14.0",
    "react-native-reanimated": "^3.6.2",
    "react-native-svg": "^15.3.0",
    "react-native-vision-camera": "^4.0.5",
    "react-native-worklets-core": "^1.3.3"
  },

And the dependencies in build.gradle:

dependencies {
    implementation("com.facebook.react:react-android")
    implementation("com.facebook.react:react-native:+")
    implementation("com.facebook.soloader:soloader:0.10.3")
    implementation 'com.google.mlkit:pose-detection:18.0.0-beta4'
    implementation 'com.google.mlkit:pose-detection-accurate:18.0.0-beta4'
    implementation 'com.google.mlkit:vision-common:17.0.0'
    implementation 'com.google.mlkit:vision-interfaces:16.0.0'
    implementation 'com.google.mlkit:camera:16.0.0-beta3'
    implementation 'androidx.annotation:annotation:1.3.0'
    implementation 'com.google.android.gms:play-services-tasks:18.0.0'
    implementation 'com.android.support:multidex:1.0.3'


    implementation project(':react-native-gesture-handler')
    implementation project(':react-native-vision-camera')
    implementation project(':react-native-svg')
    implementation project(':react-native-worklets-core')

    if (hermesEnabled.toBoolean()) {
        implementation("com.facebook.react:hermes-android")
    } else {
        implementation jscFlavor
    }
}

And my babel configurations:

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-transform-private-methods',
    '@babel/plugin-transform-flow-strip-types',
    '@babel/plugin-transform-runtime',
    '@babel/plugin-transform-arrow-functions',
    ['react-native-worklets-core/plugin'],
    ['react-native-reanimated/plugin', { globals: ['__poseDetection'] }],
  ],
};

Did I miss something? Is there a missing import that I’m not aware of?

  • I already deleted the node_modules and installed the dependencies again several times, but still the same error

  • I checked other versions of vision-camera and worklets-core, but anything else than V4 for vision-camera and V1 for worklets-core leads to compatibility issues with the other dependencies. For anything else: same error

  • I tried linking worklets-core manually to vision-camera, but for the version 1.x.x linking is disabled because it does it automatically according to the developers

  • I tried putting worklets-core as a peer dependency instead of a standard dependency. This actually leads to gradle not being able to build the app
    I get the error:

> Could not resolve all task dependencies for configuration ':classpath'.
      > Could not find com.facebook.react:react-native-gradle-plugin:.
        Required by:
            project :

When used as a standard dependency, gradle is able to find the classpath

  • I included worklets-core into the settings.gradle:
include ':react-native-worklets-core'
project(':react-native-worklets-core').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-worklets-core/android')

No changes at all

  • I checked GitHub for the same issue, but none of the issues were exactly the same. The strategies for fixing them are those that I just listed here
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    So I finally figured it out:

    The Error consists of 2 parts:

    1. "Frame Processors are not available, react-native-worklets-core is not installed!"
    2. "Error: TurboModuleRegistry.getEnforcing(...): 'Worklets' could not be found. Verify that a module by this name is registered in the native binary."

    To the first part: inserting 'import 'react-native-worklets-core';' in App.tsx, just like I mentioned in my comment, leads to solving this part.

    To the second part: my imports of MainApplication.kt were not complete. Unfortunately I did not post them here, but the lines that I forgot were the import 'import com.worklets.WorkletsPackage' and the package itself for React where 'MainReactPackage' is listed as well:

    override fun getPackages(): List<ReactPackage> {
            return Arrays.asList<ReactPackage>(
                MainReactPackage(),
                PoseDetectionPackage(),
                RNGestureHandlerPackage(),
                ReanimatedPackage(),
                CameraPackage(),
                SvgPackage(),
                WorkletsPackage() //This one
            )
        }

    It's possible that the second part of this fix also solves the first part but I just tried several things and these steps fixed the whole issue for me.


  2. 0

    try to add the following line to your babel.config.js plugins array.this should enable worklets in your React Native app. OR
    try to link your project with worklets package but manually linking is not allwoed in react native but you just try once

    react-native link react-native-worklets-core

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-transform-private-methods',
    '@babel/plugin-transform-flow-strip-types',
    '@babel/plugin-transform-runtime',
    '@babel/plugin-transform-arrow-functions',
    ['react-native-worklets-core/plugin'],
    ['react-native-worklets-core/inline-requires'], // Add this line
    ['react-native-reanimated/plugin', { globals: ['__poseDetection'] }],
  ],
};
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search