search

Enricopv / turbo-boilerplate

Turborepo Boiler Plate with Next, Remix, Expo, and React Native projects.
301 stars 24 forks source link

Fails whenever I add Recoil as dependency #14

Open amhed opened 2 years ago

amhed commented 2 years ago

Works great until I add recoil as a dependency

Repro steps:

  1. Run yarn add recoil inside of /apps/xpo
  2. Add a <RecoilRoot> wrapper for the whole app, before the NavigationStack
  3. Run the app. Get this exception
iOS Bundling complete 1049ms
 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)
4. You might be breaking the Rules of Hooks
5. 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.
RecoilRoot@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:135558:25
App
ExpoRoot@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:119162:22
RCTView
View
DevAppContainer@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:118879:36
RCTView
View
AppContainer@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:80503:36
main(RootComponent)@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:86878:28
 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.
RecoilRoot@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:135558:25
App
ExpoRoot@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:119162:22
RCTView
View
DevAppContainer@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:118879:36
RCTView
View
AppContainer@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:80503:36
main(RootComponent)@http://192.168.1.10:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false:86878:28
 ERROR  TypeError: null is not an object (evaluating 'dispatcher.useContext')

This error is located at:
    in RecoilRoot (created by App)
    in App (created by ExpoRoot)
    in ExpoRoot
    in RCTView (created by View)
    in View (created by AppContainer)
    in DevAppContainer (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent)
 ERROR  TypeError: null is not an object (evaluating 'dispatcher.useContext')

This error is located at:
    in RecoilRoot (created by App)
    in App (created by ExpoRoot)
    in ExpoRoot
    in RCTView (created by View)
    in View (created by AppContainer)
    in DevAppContainer (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent)
amhed commented 2 years ago

I ran npm ls react to verify there wasn't a version mismatch anywhere on react or react-dom

Has anyone seen a similar error?