skip to Main Content

I am new to React Native and this error isn’t giving me much to go off of. I was wondering how to solve this. There seem to be a lot of unawnsered similar questions on here so I was wondering if this is new or a common issue.

Error: [Reanimated] `valueUnpacker` is not a worklet, js engine: hermes

I can’t really provide enough of a code sample but I just started a feature with react-native-draggable-flatlist when I got this error.

—- UPDATE —–
I dove into what worklets were and started to learn about the React Natvie Reanimate library where I found that I needed to include the following in my babel.config.js

module.exports = function (api) {
    api.cache(true)
    return {
        presets: ['babel-preset-expo'],
        plugins: ['react-native-reanimated/plugin'],
    }
}

This led me to a new error where I got:

Error: [Reanimated] Mismatch between JavaScript part and native part of Reanimated (3.5.1 vs 3.3.0).
See `https://docs.swmansion.com/react-native-reanimated/docs/guides/troubleshooting#mismatch-between-javascript-part-and-native-part-of-reanimated` for more details., js engine: hermes

I followed the steps provided and tehre was only one implementation of the package:

└─┬ [email protected]
  └── [email protected]

Then I set the override in package.json but I am still getting the same issue with the mixmatch. I even started expo with the -c flag to reset the cache.

2

Answers


  1. Chosen as BEST ANSWER

    So I found this solution following this:

    Solution: Check if you have rebuilt your app after upgrading react-native-reanimated. If you use Expo Go, you must use the exact version which is bundled into Expo SDK.

    https://docs.expo.dev/versions/latest/sdk/reanimated/

    If you followed me then remove the override before starting this process or you will have some issues.


  2. make sure to add the following to package.json: yarn add react-native-reanimated and
    yarn add react-native-gesture-handler.

    Then do the following steps

    1-import "react-native-gesture-handler";
    to App.tsx
    2- npx expo start -c

    if you are using CLI run the following commands
    npx react-native start –reset-cache

    I hope it helps

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search