Error loading assets JSON from Metro: Unable to resolve module ./Easing from Animated.js

jkeane889 commented 3 years ago

Description

Hi reanimated team! Thank you so much for this amazing library! I just wanted to open an issue related to the ./Easing feature.'

Our team just integrated TypeScript into our RN application, and we do still have JavaScript components as well. At the moment we are receiving this issue in our XCode terminal:

Error: Error loading assets JSON from Metro. Ensure you've followed all expo-updates installation steps correctly. Unable to resolve module ./Easing from /.../.../.../.../.../node_modules/react-native-reanimated/src/Animated.js:

After looking through the react-native-reanimated node_module, we aren't sure whether the './Easing' component is being properly exported.

Expected behavior

'./Easing' component is imported without error into our project.

Actual behavior & steps to reproduce

Set up TS dependences following React Native documentation for an existing project: https://reactnative.dev/docs/typescript
Delete react-native-reanimated from project
Reinstall react-native-reanimated with npm install react-native-reanimated
Rebuild project in XCode
Produces XCode error code (above)

Snack or minimal code example

(In JavaScript)

import Animated, { Easing, withTiming, interpolate, Extrapolate, useSharedValue, useAnimatedStyle } from 'react-native-reanimated';

...

y.value = withTiming(0, { duration: 400, easing: Easing.bezier(0.33, 1, 0.68, 1), })

....

Package versions

"react-native-reanimated": "^2.1.0" "@types/react-native": "^0.64.2" "@types/react-test-renderer": "^17.0.1" "typescript": "^4.2.3"

React Native: 0.64.0
React Native Reanimated: ^2.1.0
NodeJS: ^6.14.8
Xcode: 12.4
Java & Gradle:

Affected platforms

[ ] Android
[x] iOS
[ ] Web

github-actions[bot] commented 3 years ago

Issue validator

The issue is valid!

arabold commented 3 years ago

Same issue here. I had to downgrade to 2.0 for now

jakub-gonet commented 3 years ago

I'm afraid I can't reproduce this. I cloned our playground app and added TS to it. Looks like it's working flawlessly and it's importing Easing too.

@jkeane889, please notice that Easing in Easing.js from Reanimated 1 is default exported which means you can import it under whatever name you want. We're importing it as EasingNode to avoid a name clash with Easing from Reanimated2.

I'm going to close this one as not reproducible but if you manage to create simple repro please share so we can check it.

Also, try clearing all caches (delete node_modules, Xcode & Gradle cache, run metro with --reset-cache flag, etc). I saw you're installing reanimated with npm, could you give Yarn a try?

iwantadventureinthegreatwidesomewhere commented 3 years ago

I know this issue is marked as closed but if you are still experiencing it, I launched metro with npm start -- --reset-cache and got it to finally work. Had the exact same issue as you after upgrading from a 1.x version of this package.

software-mansion / react-native-reanimated