Cannot read property 'makeMutable' of undefined

Question

I installed "react-native-reanimated ^3.11.0" here is bable.config.js after adding plugins: according to reanimated docs

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: ['react-native-reanimated/plugin'],
};

App giving an error as

Cannot read property 'makeMutable' of undefine

React Native version 0.74.1 Device Android Emulator

I am sharing screenshot of error

I installed latest version of react-native-reanimated 3.11.0 and also add plugins in bable.config.js Here is bable code:

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: ['react-native-reanimated/plugin'],
};

do all things according to reanimated docs

Answer 1

I am using

"react-native-reanimated": "^3.16.6",
"react-native": "0.76.3"

I have added plugins: ['react-native-reanimated/plugin'] in babel.config.js just like you did.

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: ['react-native-reanimated/plugin'],
};

Add the key part is resetCache:true in metro.config.js like:

const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
const { wrapWithReanimatedMetroConfig } = require('react-native-reanimated/metro-config');

/**
 * Metro configuration
 * https://reactnative.dev/docs/metro
 *
 * @type {import('metro-config').MetroConfig}
 */
const config = {
  resetCache: true,
};

module.exports = wrapWithReanimatedMetroConfig(
  mergeConfig(getDefaultConfig(__dirname), config)
);

Answer 2

About 10 days ago, I was using "react-native-reanimated": "^3.9.0" without any issues. However, after upgrading to version 3.11.0, I started encountering the same problem. I resolved the issue by downgrading the version and running

first

npm install [email protected]

after

npm start -- --reset-cache.