React-native-reanimated: useSharedValue is undefined

[Adriein]

Description

After following the instructions on https://docs.expo.io/versions/latest/sdk/reanimated/ for enabling react-native-reanimated v2 on expo and trying to use useSharedValue the next error appears:

TypeError: (0, _reactNativeReanimated.useSharedValue) is not a function. (In '(0, _reactNativeReanimated.useSharedValue)(0)', '(0, _reactNativeReanimated.useSharedValue)' is undefined)

• node_modulesreact-nativeLibrariesLogBoxLogBox.js:148:8 in registerError
• node_modulesreact-nativeLibrariesLogBoxLogBox.js:59:8 in errorImpl
• node_modulesreact-nativeLibrariesLogBoxLogBox.js:33:4 in console.error
• node_modulesexpobuildenvironmentreact-native-logs.fx.js:27:4 in error
• node_modulesreact-nativeLibrariesCoreExceptionsManager.js:104:6 in reportException
• node_modulesreact-nativeLibrariesCoreExceptionsManager.js:171:19 in handleException
• node_modulesreact-nativeLibrariesCoresetUpErrorHandling.js:24:6 in handleError
• node_modulesexpo-error-recoverybuildErrorRecovery.fx.js:9:32 in ErrorUtils.setGlobalHandler$argument_0
• node_modulesregenerator-runtimeruntime.js:63:36 in tryCatch
• node_modulesregenerator-runtimeruntime.js:293:29 in invoke
• node_modulesregenerator-runtimeruntime.js:63:36 in tryCatch
• node_modulesregenerator-runtimeruntime.js:154:27 in invoke
• node_modulesregenerator-runtimeruntime.js:164:18 in PromiseImpl.resolve.then$argument_0
• node_modulesreact-nativenode_modulespromisesetimmediatecore.js:37:13 in tryCallOne
• node_modulesreact-nativenode_modulespromisesetimmediatecore.js:123:24 in setImmediate$argument_0
• node_modulesreact-nativeLibrariesCoreTimersJSTimers.js:130:14 in _callTimer
• node_modulesreact-nativeLibrariesCoreTimersJSTimers.js:181:14 in _callImmediatesPass
• node_modulesreact-nativeLibrariesCoreTimersJSTimers.js:441:30 in callImmediates
• node_modulesreact-nativeLibrariesBatchedBridgeMessageQueue.js:387:6 in __callImmediates
• node_modulesreact-nativeLibrariesBatchedBridgeMessageQueue.js:135:6 in __guard$argument_0
• node_modulesreact-nativeLibrariesBatchedBridgeMessageQueue.js:364:10 in __guard
• node_modulesreact-nativeLibrariesBatchedBridgeMessageQueue.js:134:4 in flushedQueue
• [native code]:null in flushedQueue
• [native code]:null in invokeCallbackAndReturnFlushedQueue

Screenshots

file where i'm using it:

pckage.json deps:

babel config:

app.json:

Steps To Reproduce

1. create a react native app with expo
2. follow this guide to enable react native reanimated v2 : https://docs.expo.io/versions/latest/sdk/reanimated/
3. try to use useSharedValue on any file

Expected behavior

I expect to use useSharedValue to update the x value while swapping

Actual behavior

The app crashes due finding an existing function undefined

Snack or minimal code example

Package versions

• React:
• React Native:
• React Native Reanimated:
• NodeJS:

[github-actions[bot]]

Issue validator - update # 3

Hello!
Congratulations! Your issue passed the validator! Thank you!

[jakub-gonet]

Could you try installing Rea2 via yarn and report back here? I think I've seen similar issues in the past when using npm instead of yarn.

[vcellu]

I am having a similar issue with VSCode. I am using Yarn. Same project works fine outside of VSCode by just running yarn iOS

Launching the application
Attaching to the application
Starting debugger app worker.
Established a connection with the Proxy (Packager) to the React Native application
Debugger worker loaded runtime on port 36395
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'NativeReanimated' could not be found. Verify that a module by this name is registered in the native binary.
node_modules/react-native/Libraries/Core/ExceptionsManager.js:179
Running application ModernBottomSheet ({
    initialProps =     {
    };
    rootTag = 11;
})
node_modules/react-native/Libraries/Utilities/RCTLog.js:47
Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)
node_modules/react-native/Libraries/Core/ExceptionsManager.js:179
Running surface LogBox ({
    initialProps =     {
    };
    rootTag = 21;
})
node_modules/react-native/Libraries/Utilities/RCTLog.js:47
Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)
node_modules/react-native/Libraries/Core/ExceptionsManager.js:179
Failed to mount LogBox within 1s

[Adriein]

Could you try installing Rea2 via yarn and report back here? I think I've seen similar issues in the past when using npm instead of yarn.

I'm gonna try it tomorrow but why is this happening? I mean, npm is also a package manager, I've never had problems installing packages via npm so why is this library different? Btw thanks a lot for the quick response jakub 💯

Could it be some babel failure when babel is attaching the plugin? Speaking from the absolute ignorance but I've dived a little into the package code and the function is there waiting to be used

img from node_modules/react-native-reanimated/src/reanimated2/Hooks.js:

[Adriein]

I've just tried it with yarn, same error... I've seen another opened issues having the same problem

[karo-dc]

Also I have the same problem, can not use v2 package, useSharedValue is undefined. Maybe someone solved this?

[Aaron-Porter]

Running into this same problem. Configured according to the expo guide. Receiving this error:

(0, _reactNativeReanimated.useSharedValue) is not a function. (In '(0, _reactNativeReanimated.useSharedValue)(0)', '(0, _reactNativeReanimated.useSharedValue)' is undefined)

[ajlamarc]

https://docs.expo.io/versions/latest/sdk/reanimated/
I had this problem and it just resolved luckily, here was my steps:

1. From the link above, update the babel config file as shown. (and enable turbo modules, shown in OP)
2. expo install react-native-reanimated (downgraded from 2.0.0 to 1.1.3)
3. yarn add [email protected]
4. expo start -c

Perhaps removing the package and starting over was enough to reset it and wire it up properly.

[JosePatricio]

still facing this error using react native cli , anyone solved it?

[sinclaireric]

the error persist