moti: Can't get moti to work with Expo or native

Hey,

I can’t seem to get moti working. I’ve tried it on both Expo and bare React Native project.

I’ve tried react-native-reanimated RC0, RC2, RC3. I’m on moti v0.4.1.

I’ve added react-native-reanimated/plugin to my Babel config.

But I get different errors with different versions.

Bare React Native with RC2

	14:40:34.086	Can't find variable: _globalSetter

_f
	14:38:00.888	Tried to synchronously call function {assign} from a different thread.

Occurred in worklet location: app/node_modules/@motify/core/src/use-map-animate-to-style.ts (240:33)

Possible solutions are:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
	14:38:00.893	TypeError: undefined is not an object (evaluating 'ref.current.last')

This error is located at:
    in ForwardRef(Wrapped) (at spinner.tsx:60)
    in RCTView (at View.js:34)
    in View (at spinner.tsx:33)
    in Spinner (at loading.tsx:15)
    in RCTView (at View.js:34)
    in View (at loading.tsx:13)
    in Loading (at src/index.tsx:20)
    in Willa (at app/index.js:18)
    in QueryClientProvider (at app/index.js:16)
    in App (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
    in AppContainer (at renderApplication.js:39)
	14:38:00.899	TypeError: undefined is not an object (evaluating 'ref.current.last')

This error is located at:
    in ForwardRef(Wrapped) (at spinner.tsx:47)
    in RCTView (at View.js:34)
    in View (at spinner.tsx:33)
    in Spinner (at loading.tsx:15)
    in RCTView (at View.js:34)
    in View (at loading.tsx:13)
    in Loading (at src/index.tsx:20)
    in Willa (at app/index.js:18)
    in QueryClientProvider (at app/index.js:16)
    in App (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
    in AppContainer (at renderApplication.js:39)
	14:38:00.903	TypeError: undefined is not an object (evaluating 'ref.current.last')

This error is located at:
    in ForwardRef(Wrapped) (at spinner.tsx:34)
    in RCTView (at View.js:34)
    in View (at spinner.tsx:33)
    in Spinner (at loading.tsx:15)
    in RCTView (at View.js:34)
    in View (at loading.tsx:13)
    in Loading (at src/index.tsx:20)
    in Willa (at app/index.js:18)
    in QueryClientProvider (at app/index.js:16)
    in App (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
    in AppContainer (at renderApplication.js:39)
	14:38:00.905	TypeError: undefined is not an object (evaluating 'ref.current.last')

This error is located at:
    in ForwardRef(Wrapped) (at spinner.tsx:60)
    in RCTView (at View.js:34)
    in View (at spinner.tsx:33)
    in Spinner (at loading.tsx:15)
    in RCTView (at View.js:34)
    in View (at loading.tsx:13)
    in Loading (at src/index.tsx:20)
    in Willa (at app/index.js:18)
    in QueryClientProvider (at app/index.js:16)
    in App (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
    in AppContainer (at renderApplication.js:39)
	14:38:00.973	undefined is not an object (evaluating 'Object.keys(mergedStyles)')

keys@[native code]
_f
[native code]
styleUpdater
[native code]
_f
[native code]

Bare React Native with RC0

	14:41:18.856	
Tried to synchronously call function {assign} from a different thread.
Solution is:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
	14:41:19.010	undefined is not an object (evaluating 'Object.keys(mergedStyles)')

keys@[native code]
_f
[native code]
styleUpdater
[native code]
_f
[native code]
	14:41:19.097	
Tried to synchronously call function {assign} from a different thread.
Solution is:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
	14:41:19.185	undefined is not an object (evaluating 'Object.keys(mergedStyles)')

keys@[native code]
_f
[native code]
styleUpdater
[native code]
_f
[native code]
	14:41:19.242	
Tried to synchronously call function {assign} from a different thread.
Solution is:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
	14:41:19.349	undefined is not an object (evaluating 'Object.keys(mergedStyles)')

keys@[native code]
_f
[native code]
styleUpdater
[native code]
_f
[native code]
	14:41:19.413	
Tried to synchronously call function {assign} from a different thread.
Solution is:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
	14:41:19.503	undefined is not an object (evaluating 'Object.keys(mergedStyles)')

keys@[native code]
_f
[native code]
styleUpdater
[native code]
_f
[native code]

What am I missing? I’m using 16.13.1 for React and 0.63.4 for React Native.

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 17 (9 by maintainers)

Most upvoted comments

I am using reanimated 2.2 and it is working fine but when I use Moti, it gives me error of (evaluating ‘_$$_REQUIRE(_dependencyMap[4], “moti”).MotiView’)

This should be fixed in the latest version of moti (anything above 0.5.8)!

Please try yarn add moti and let me know if it works.

moti 0.6.0 works out of the box with react-native-reanimated 2.0.0 without a hitch!