Invalid hook call. Hooks can only be called inside of the body of a function component when apply style to class base component with material-ui

Question

I am just started to learn reactjs using material-ui but getting this error when apply style to my component. My code:

const useStyles = makeStyles(theme => (         


        

Answer 1

if you have created a functional component and still run into this issue... the next thing to look for are the dependency versions.

I tried a new stackblitz project to test a material-ui component and got this error. My dependencies were:

react 16.12

react-dom 16.12

@material-ui/core 4.9.14

So I had to change to latest react version using react@latest and react-dom@latest which got me to the following:

react 16.13.1

react-dom 16.13.1

@material-ui/core 4.9.14

Sharing here so that it can help other people who run into this... thanks to this post for the hint