关于MUIv4与v5的差异 #
v4 与v5在组件上的差异不大，但是组包方式有重大的更改。同时组件的样式注入改为了emotion库。
目前MUI-v5的包有如下几个：(https://mui.com/zh/guides/understand-mui-packages/)
- @mui/material， 核心组件库
- @mui/system，
- @mui/base， 是一个unstyled components， 你可以认为material部分的组件是用styled-engine修饰过的base组件。
- @mui/styled-engine， 样式设计引擎emotion的封装
- @mui/styled-engine-sc， 样式设计引擎，styled-components的封装，与上一条可以按需使用。
- @mui/styles, 即将被删除
emotion是system部分默认使用的样式引擎，即官方推荐使用的是@mui/styled-engine。后面介绍emotion的特性。
传统的JSS-in-CSS，
对于用户来说，我们直接接触的部分其实就是@mui/material， 一切都从这个包里获取。
MUI-v5响应式改造 #
响应式改造主要是按照宽度自动调节：字体大小、间距、宽度、排版方向、可见性等。以此实现在不同大小的设备上都有良好的展示效果。