software-mansion / react-native-reanimated

React Native's Animated library reimplemented
https://docs.swmansion.com/react-native-reanimated/
MIT License
8.83k stars 1.29k forks source link

Issue on createAnimatedComponent.tsx Unexpected token, expected "," #5725

Closed codeweight closed 2 weeks ago

codeweight commented 6 months ago

Description

Running an expo react-native application with expo version "expo": "^49.0.0" and system MAC M1 Venture 13.2.1 (22D68) Node version is v20.11.1 & npm version is 10.2.4 & npx version is 10.2.4

Have configured all the packages and plugins correctly even ./gradlew clean command is getting successful. But while running the yarn android on run time on the emulator below issue arises for the react-native-reanimated for syntax error.

Find the issue as below,

`error: SyntaxError: /Users/devendraahirwar/Desktop/Documents/apps/expoapps/mm/matrimoniallagnagathi/node_modules/react-native-reanimated/src/createAnimatedComponent/createAnimatedComponent.tsx: Unexpected token, expected "," (105:28)

103 | // @ts-ignore This is required to create this overload, since type of createAnimatedComponent is incorrect and doesn't include typeof FlatList 104 | export function createAnimatedComponent(

105 | component: typeof FlatList, | ^ 106 | options?: Options 107 | ): ComponentClass<AnimateProps<FlatListProps>>; 108 | `

Have the dependency version as, ` "react-native": "0.72.10", "react-native-reanimated": "^3.7.1",

`

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

Android screenshot: Screenshot_1708773423

Also in the iOS platform, it fails with the react-native-reanimated package: Below is the iOS runtime error caught on simulator `iOS Bundling failed 12533ms error: SyntaxError: /Users/devendraahirwar/Desktop/Documents/apps/expoapps/mm/matrimoniallagnagathi/node_modules/react-native-reanimated/src/reanimated2/threads.ts: Unexpected token (235:47)

233 | 234 | return (...args) =>

235 | runOnJS(runWorkletOnJS<Args, ReturnValue>)( | ^ 236 | fun as WorkletFunction<Args, ReturnValue>, 237 | ...args 238 | );

` iOS screenshot: Simulator Screen Shot - iPhone 14 Pro Max - 2024-02-24 at 16 46 01

Any solution to this?

Steps to reproduce

While running the application on the emulator it shows the error

Snack or a link to a repository

https://sudodev8898@bitbucket.org/sysmarche/matrimonial.git

Reanimated version

3.7.1

React Native version

0.72.10

Platforms

Android

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

github-actions[bot] commented 6 months ago

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

Latropos commented 6 months ago

I've just created a new app with reanimated and everything seems to work. I use "expo": "^50.0.1", and my node version is 21.1.0

codeweight commented 6 months ago

Hi @Latropos, I have updated my app for expo package to "expo": "^49.0.0" will this it work or I need to create a new app only.

Latropos commented 6 months ago

Just try updating expo