error: Error: Unable to resolve module ./Hooks from /node_modules/react-native-reanimated/src/reanimated2/index.ts

Viewed 1715

I'm new installation React Native Reanimated 2.3.0-beta.1, and already follow setup from documentation.

"react-native-gesture-handler": "^1.10.3",
"react-native-reanimated": "^2.3.0-beta.2",

and when start my app, the following error occurs:

error: Error: Unable to resolve module ./Hooks from /ProjectName/node_modules/react-native-reanimated/src/reanimated2/index.ts: 
None of these files exist:
* node_modules/react-native-reanimated/src/reanimated2/Hooks(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.svg|.native.svg|.svg)
* node_modules/react-native-reanimated/src/reanimated2/Hooks/index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.svg|.native.svg|.svg)
> 1 | export * from './core';
  2 | export * from './hook';
  3 | export * from './animation';
  4 | export * from './interpolation';
    at ModuleResolver.resolveDependency (/ProjectName/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:107:15)
    at DependencyGraph.resolveDependency (/ProjectName/node_modules/metro/src/node-haste/DependencyGraph.js:288:43)
    at Object.resolve (/ProjectName/node_modules/metro/src/lib/transformHelpers.js:129:24)
    at resolve (/ProjectName/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:33)
    at /ProjectName/node_modules/metro/src/DeltaBundler/traverseDependencies.js:412:26
    at Array.reduce (<anonymous>)
    at resolveDependencies (/ProjectName/node_modules/metro/src/DeltaBundler/traverseDependencies.js:411:33)
    at processModule (/ProjectName/node_modules/metro/src/DeltaBundler/traverseDependencies.js:140:31)
    at async addDependency (/ProjectName/node_modules/metro/src/DeltaBundler/traverseDependencies.js:230:18)
    at async Promise.all (index 6)

Any help will be appreciated!

2 Answers

I believe you were getting the warning message about following instructions on installing react-native-reanimated on your React Native app and decided to follow their instructions at https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation

This was my scenario and once I did everything they asked me to do, I started getting this error.

Here's what I did to fix this:

  1. First, instead of installing react-native-reanimated@next as they suggested which installs 2.3.0-beta2, I installed the latest stable version which is 2.2.3
  2. I then tested it and that made the issue go away but then my app kept freezing up. Then I decided to undo another step in their instructions and set enableHermes: false in android/app/build.gradle

This fixed things for me.

Reset JavaScript cache by executing this command:

npx react-native start --reset-cache
Related