我应该将 SCSS 与 material-ui 一起使用还是使用 material-ui 样式？

Question

I need an expert view on whether to use material-ui styles OR scss?

I saw couple of projects shifting to MUI based styles rather than scss , just was going over docs [https://mui.com/system/styles/basics/][1] it say it is deprecated and no longer supported by MUI and is also not supported in react 18.

Also it doesn't support SSR in case of Next.js only thing that is supported by MUI is styled component but that is just like dealing with styled-component library nor it has any speed benefit over scss.

My question is whether it's wise to use scss with material UI or use material ui styles? and what are the benefits of using one over other?

Answer 1

I wouldn't say that i am an expert but from my experiences working with MUI for 3 years i think you 'll need both. But make sure you have your own styles and use your scss guidStyles as much as possible , it's easier to inspect and gives you more clear view about the code structure rather than MUI auto generated classes. In fact sometimes you'll need it eg : if you have to detect some element's width and based on that you have to deal with it and increase some other width + element width , then you can reach it by using MUI makeStyles . So shortly : Make sure you jave your own scss variables, colors, sizes, fonts , etc .. including break points and mixins. But when you need to integrate with MUI feel free to just use it.