React node_modules Installation Location Causes Invalid Hook Call
See original GitHub issueBug report
Describe the bug
First bug report so patience appreciated. Following an installation of @material-ui/core receive “Invalid hook call”. Traced the issue back to any hook in general and react installation location.
To Reproduce
Created simple standard folder structure: src |–components |–pages |–package.json |–next.config.js |–etc. etc. public |–placeholder.html |–404.html functions |–index.js |–package.json
Functions package.json is identical with additional firebase-admin and firebase-functions
Once you add @material-ui/core and make a simple button get:
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://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.
Changing the button to simple <button onClick={...}>Click Me</button> works.
On deploy, the following error:
Error occurred prerendering page "/" https://err.sh/zeit/next.js/prerender-error: Error: Minified React error #321
Expected behavior
Easy implementation of @material-ui
Screenshots
If applicable, add screenshots to help explain your problem.
System information
linux ubuntu
Additional context
This is not a duplicate of #7626
Issue Analytics
- State:
- Created 4 years ago
- Reactions:2
- Comments:8 (2 by maintainers)

Top Related StackOverflow Question
Did you ever find a fix for this? I have the same issue
This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.