nandorojo/moti

Skeleton is not working because of null useContext from Skeleton.js

Closed this issue · 5 comments

Is there an existing issue for this?

  • I have searched the existing issues

Do you want this issue prioritized?

  • Yes, I have sponsored
  • Not urgent

Current Behavior

I was using npx create-expo-app StickerSmash --template blank to create an expo project sdk 51, but it is not working with error Cannot read property 'useContext' of null

Expected Behavior

No response

Steps To Reproduce

  1. Create a new Expo project with sdk 51. command: npx create-expo-app StickerSmash --template blank
  2. Install moti dependency. command: npx expo install moti
  3. Install reanimated dependency. command: npx expo install react-native-reanimated
  4. Install expo-linear-gradient dependency. command: npx expo install expo-linear-gradient
  5. Use moti skeleton component
  6. Run the app. command: npx expo start --tunnel
  7. Get an error message:
    TypeError: Cannot read property 'useContext' of null

ERROR Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
    See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
    ERROR Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
  4. You might have mismatching versions of React and the renderer (such as React DOM)
  5. You might be breaking the Rules of Hooks
  6. You might have more than one copy of React in the same app
    See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
    ERROR TypeError: Cannot read property 'useContext' of null

This error is located at:
in Skeleton
in SkeletonExpo (created by App)
in RCTView (created by View)
in View (created by App)
in RCTView (created by View)
in View (created by App)
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in main(RootComponent), js engine: hermes
ERROR TypeError: Cannot read property 'useContext' of null

Versions

- Moti: 0.29.0
- Reanimated: 3.10.1
- React Native: 0.74.1
- expo-linear-gradient: 13.0.2
- expo: 51.0.8

Screenshots

IMG_0206

Reproduction

https://codesandbox.io/p/github/yousefturin/Bug-report-moti/master?file=%2Fpackage.json%3A4%2C30&workspaceId=8bcfb81d-12cd-4e3c-8fa1-5b7bd94dab01
To connect a mobile the run command must be npx expo start --tunnel and the error will show.

For some reasons I have tried to use the solution from #189, but it did not work I tried again the next day with the exact same steps and it did work.
my apology.

I am facing the same issue currently. Have you been able to resolve it?

Same problem!

to solve the issue in my case was just to delete the node models folder and install it using
npm install --legacy-peer-deps
The issue was that I had a dirty node models file and when I had to run the application after re-installing it was giving this error, and the solution was to use the legacy peer deps command when installing the packages.

Ahh yes npm always has this issue. The moti docs mention using legacy peer deps for this reason. I use yarn so I never come across it. Thanks for sharing!