Issues on installing npm packages

My frontend stops working if I install any npm packages to the volto project ,

npm install @mui/material @emotion/react @emotion/styled

after installation this is how my frontend is.....

That's due to your uncaught error. First fix that invalid hook call.

the project was working perfect, until installing that package .i had also tried to install many other react component library like React-Bootstrap and Ant , by installing all those i get the same issue.

I'm not trying to discourage you from Volto, but by trying to shoehorn another component library into Volto, you're getting into extremely complex territory. It could probably be done, but you need to have a lot of experience with React, webpack / JS packaging, Volto, etc. My advice is to try to use the React component library that's already shipped with Volto, which is the semantic-ui-react. See https://react.semantic-ui.com/. You don't have to do anything to make those components work with Volto, they already work. Just import them, like: import {Tab} from 'semantic-ui-react';

1 Like

One day, developers will learn to copy and paste text instead of images. I can't read these blurry images with illegible tiny fonts, so I can't help. Oh, well.

The linked image was fine. I actually prefer, for this exact "use case", to see the screenshot, it makes me feel more secure in understanding exactly what the problem is.

1 Like

Got a "Invalid Hook Call Error" today after working on add-ons.
The issue vanished into thin air by removing node_modules and re-running yarn.
HTH anyone stumbling upon this later on.