expo: Cannot read property 'useMemo' of null
Minimal reproducible example
https://github.com/bestform/expo-router-bug
Which package manager are you using? (Yarn is recommended)
npm
If the issue is web-related, please select the bundler (web.bundler in the app.json)
None
Summary
When using expo-router 3.4.9, the app does not start. Instead it says: TypeError: Cannot read property 'useMemo' of null
What I did:
npx create-expo-app -t
As a template I chose TypeScript (Blank)
npx expo install expo-router react-native-safe-area-context react-native-screens expo-linking expo-constants expo-status-bar react-native-gesture-handler
mkdir app
mv App.tsx app/index.tsx
Change “main” entry in package.json to expo-router/entry
Add a “scheme” to app.json
Run the Expo go server using npx expo start
What I expected:
The App is running in the expo go app showing app/index.tsx
What happened instead:
An error screen saying: TypeError: Cannot read property 'useMemo' of null
This is the full stack trace:
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.
at ContextNavigator (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:132996:24)
at ExpoRoot (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:132952:28)
at App
at ErrorToastContainer (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:163392:24)
at ErrorOverlay
at withDevTools(ErrorOverlay) (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:163142:27)
at RCTView
at View (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40237:43)
at RCTView
at View (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40237:43)
at AppContainer (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40048:36)
at main(RootComponent) (http://192.168.178.26:8081/node_modules/expo-router/entry.bundle//&platform=android&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:124359:28)
ERROR TypeError: Cannot read property 'useMemo' of null
And:
This error is located at:
in ContextNavigator (at ExpoRoot.js:64)
in ExpoRoot (at qualified-entry.js:20)
in App (created by ErrorOverlay)
in ErrorToastContainer (created by ErrorOverlay)
in ErrorOverlay (at withDevTools.js:18)
in withDevTools(ErrorOverlay) (at renderApplication.js:57)
in RCTView (at View.js:116)
in View (at AppContainer.js:127)
in RCTView (at View.js:116)
in View (at AppContainer.js:155)
in AppContainer (at renderApplication.js:50)
in main(RootComponent) (at renderApplication.js:67), js engine: hermes
ERROR TypeError: Cannot read property 'useMemo' of null
Both traces are being printed twice. So the first part is printed twice and then the second part is printed twice.
Environment
expo-env-info 1.2.0 environment info: System: OS: macOS 14.4.1 Shell: 5.9 - /bin/zsh Binaries: Node: 20.12.2 - /usr/local/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 10.5.2 - /usr/local/bin/npm Watchman: 2023.10.02.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.12.1 - /opt/homebrew/bin/pod SDKs: iOS SDK: Platforms: DriverKit 23.4, iOS 17.4, macOS 14.4, tvOS 17.4, visionOS 1.1, watchOS 10.4 IDEs: Xcode: 15.3/15E204a - /usr/bin/xcodebuild npmPackages: expo: ~50.0.14 => 50.0.17 expo-router: ~3.4.9 => 3.4.9 react: 18.2.0 => 18.2.0 react-native: 0.73.6 => 0.73.6 Expo Workflow: managed
About this issue
- Original URL
- State: closed
- Created 2 months ago
- Reactions: 7
- Comments: 21 (3 by maintainers)
Commits related to this issue
- [router] Switch from react-helmet-async to react-native-helmet-async (#28532) # Why Fix https://github.com/expo/expo/issues/28471 # How @byCedric published react-native-helmet-async, a fork ... — committed to expo/expo by brentvatne 2 months ago
- [router] Switch from react-helmet-async to react-native-helmet-async (#28532) Fix https://github.com/expo/expo/issues/28471 @byCedric published react-native-helmet-async, a fork of react-helmet-asyn... — committed to expo/expo by brentvatne 2 months ago
hi there!
here’s what happened
how you can solve this right now
you can do any of the following things:
npx expo install react-domin your project, then runnpm why react-domto verify that you only have 18.2.0 installed--legacy-peer-depsoption with npmwhat we can do
tbd! maybe we can update react-helmet-async? let us know if you have suggestions
Switching to yarn solved the issue for me as well. Could be something to do with the different deps resolve.
getting the same Issue
edited: Change from npm to yarn and it now works