Open guillaumegaluz opened 1 year ago
tomekzaw
commented
1 year ago Hey @guillaumegaluz, thanks for reporting this issue.
In Reanimated 3 we added @babel/plugin-proposal-optional-chaining as a peerDependency:
For Reanimated 2.14.4 you'll need to add @babel/plugin-proposal-optional-chaining as a devDependency in your app.
guillaumegaluz
commented
1 year ago Thanks! getting the same error with @babel/plugin-proposal-nullish-coalescing-operator now. Is there a list of packages i need to add?
guillaumegaluz
commented
1 year ago ok great. this will save me a bit of trial and error. thanks!
guillaumegaluz
commented
1 year ago ok it's working. this issue is resolved thanks. you can close it but...
if you don't mind i just want to ask one more thing. the next error that i'm getting is (full stack trace below)
ERROR TypeError: property is not configurable
This error is located at:
in ViewManagerAdapter_ExpoLinearGradient (created by Adapter<ExpoLinearGradient>)
in Adapter<ExpoLinearGradient> (created by LinearGradient)
...It seems related to react-navigation and reanimated and i saw you commented on an issue that seems related to a fix that proposed to solve it so i thought i'd ask if you have an idea or can point me to an issue or maybe just tell me in which repo i should create an issue.
Dzięki!
ERROR TypeError: property is not configurable
This error is located at:
in ViewManagerAdapter_ExpoLinearGradient (created by Adapter<ExpoLinearGradient>)
in Adapter<ExpoLinearGradient> (created by LinearGradient)
in LinearGradient
in RCTView (created by View)
in View (created by AnimatedComponent(View))
in AnimatedComponent(View)
in Unknown
in Wrap (created by AnimatedComponent(Wrap))
in AnimatedComponent(Wrap)
in Unknown (created by GestureDetector)
in GestureDetector
in ScrollContextProvider
in Unknown (created by Home)
in RCTView (created by View)
in View (created by Home)
in RCTView (created by View)
in View (created by GestureHandlerRootView)
in GestureHandlerRootView (created by Home)
in Home (created by SceneView)
in StaticContainer
in EnsureSingleNavigator (created by SceneView)
in SceneView (created by SceneView)
in RCTView (created by View)
in View (created by DebugContainer)
in DebugContainer (created by MaybeNestedStack)
in MaybeNestedStack (created by SceneView)
in RNSScreen (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper (created by InnerScreen)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by InnerScreen)
in InnerScreen (created by Screen)
in Screen (created by SceneView)
in SceneView (created by NativeStackViewInner)
in Suspender (created by Freeze)
in Suspense (created by Freeze)
in Freeze (created by DelayedFreeze)
in DelayedFreeze (created by ScreenStack)
in RNSScreenStack (created by ScreenStack)
in ScreenStack (created by NativeStackViewInner)
in NativeStackViewInner (created by NativeStackView)
in RCTView (created by View)
in View (created by SafeAreaInsetsContext)
in SafeAreaProviderCompat (created by NativeStackView)
in NativeStackView (created by NativeStackNavigator)
in Unknown (created by NativeStackNavigator)
in NativeStackNavigator (created by Navigation)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by Navigation)
in RCTView (created by View)
in View (created by Navigation)
in Navigation (created by App)
in RCTView (created by View)
in View (created by App)
in App (created by App)
in WatchlistProvider (created by App)
in CityProvider (created by App)
in RCTView (created by View)
in View (at ActionSheet/index.ios.tsx:16)
in ActionSheet (at ActionSheetProvider.tsx:35)
in ActionSheetProvider (created by App)
in QueryClientProvider (created by App)
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider (created by App)
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in main(RootComponent), js engine: hermes
Noitham
commented
1 year ago I'm on "react-native-reanimated": "~3.3.0" and also getting this error 🤔.
Error is thrown when using "@babel/core": "7.22.9",.
For example with "@babel/core": "7.22.1",. - all good.
vladRGaembla
commented
1 year ago You can add this in your package.json and this should solve the issue. But i think this is not expected behaviour and it would be better if somehow we can remove these dependencies to use storybook
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0-0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0-0",
"@babel/plugin-transform-arrow-functions": "^7.0.0-0",
"@babel/plugin-transform-shorthand-properties": "^7.0.0-0",
"@babel/plugin-transform-template-literals": "^7.0.0-0",
ansh
commented
1 year ago I was facing this when I upgraded @babel.core to the latest version. Keep it 7.20.0 or whatever was recommended with your version of Reanimated
Bekaxp
commented
1 year ago But why these two: "@babel/plugin-proposal-nullish-coalescing-operator" "@babel/plugin-proposal-optional-chaining"
are not: "@babel/plugin-transform-nullish-coalescing-operator" "@babel/plugin-transform-optional-chaining" ?
If I change this code manually in the plugin.js like bellow:
plugins: [
"@babel/plugin-transform-shorthand-properties",
"@babel/plugin-transform-arrow-functions",
"@babel/plugin-transform-optional-chaining",
"@babel/plugin-transform-nullish-coalescing-operator",
["@babel/plugin-transform-template-literals", { loose: true }]
],then these plugins doesn't need to be set as a dependency of my app because they are already there when using metro-react-native-babel-preset
BUT maybe the reason is that react-native-reanimated is running an old v7.20.0 @babel/core, which doesn't have those two rules yet? Any plan to update? Thanks
tom-at-pixel
commented
1 year ago I am running into the same issue after upgrading Babel. I am on "@babel/core": "^7.23.0" and "react-native-reanimated": "~3.3.0" (latest versions supported by Expo).
Should we manually add react-native-reanimated's peer dependencies per the comment above? If so, should this be described in the Getting started guide? Everything worked fine with "@babel/core": "7.22.1".
EDIT: Adding the peer dependencies to package.json and babel.config.js solves the issue, but it feels like a hack since things worked fine with an older version of Babel.
Shota0006
commented
1 year ago Same here with @babel/core": "7.22.20 and react-native-reanimated": "3.5.4" and "metro-react-native-babel-preset": "0.77.0"
as above comment, https://github.com/software-mansion/react-native-reanimated/issues/4538#issuecomment-1715717218 after I patched the file, it worked.
diff --git a/node_modules/react-native-reanimated/plugin/build/plugin.js b/node_modules/react-native-reanimated/plugin/build/plugin.js
index ae23a01..97e7a09 100644
--- a/node_modules/react-native-reanimated/plugin/build/plugin.js
+++ b/node_modules/react-native-reanimated/plugin/build/plugin.js
@@ -309,8 +309,8 @@ var require_makeWorklet = __commonJS({
plugins: [
require.resolve("@babel/plugin-transform-shorthand-properties"),
require.resolve("@babel/plugin-transform-arrow-functions"),
- require.resolve("@babel/plugin-proposal-optional-chaining"),
- require.resolve("@babel/plugin-proposal-nullish-coalescing-operator"),
+ require.resolve("@babel/plugin-transform-optional-chaining"),
+ require.resolve("@babel/plugin-transform-nullish-coalescing-operator"),
[
require.resolve("@babel/plugin-transform-template-literals"),
{ loose: true }
Description
Getting this the first time i load
react-native-reanimatedWhen running
npx expo start --dev-client --clearFull stack is
my package.json is
babel.config is
Steps to reproduce
see stack traces above
Snack or a link to a repository
https://github.com/guillaumegaluz/cinecitta-native
Reanimated version
2.14.4
React Native version
0.71.8
Platforms
iOS
JavaScript runtime
None
Workflow
None
Architecture
None
Build type
None
Device
None
Device model
No response
Acknowledgements
Yes