在 Material-UI v5 中，一些 API 使用是从 导入的@mui/material/styles，例如useTheme. 并且一些 API 使用是从 导入的@mui/styles，例如makeStyles. 我可以使用这些风格相关的API，只从一个库，可@mui/styles还是@mui/material/styles？因为，在 Material-UI v4 中，我从'@material-ui/core/styles'或导入了所有与样式相关的 API 'material-ui/styles'。
@mui/material/styles 和@mui/styles 的区别？
IT技术
reactjs
material-ui
2021-04-08 07:17:16
1个回答
通常在 v4 中，您会从@material-ui/core/styles. 这个在幕后使用了JSS：
import { makeStyles } from '@material-ui/core/styles';
在 v5 中，他们将品牌名称更改为 MUI。结果，包名也发生了变化：
import { makeStyles } from '@mui/material/styles';
但是MUI V5也下降了JSS（其中，支撑makeStyles/withStyles使用），所以他们搬完的API称为旧程序包@mui/styles。（他们计划在 v6 中删除此 API，但有一些阻力。有关更多信息，请参阅此问题）
import { makeStyles } from '@mui/styles';
并鼓励用户采用更新的样式解决方案 ( sx, styled) 使用情感作为默认样式引擎：
import { styled } from "@mui/material/styles";
因此，在总结中，之间的区别@mui/material/styles，并@mui/styles认为：
@mui/styles |
@mui/material/styles |
|---|---|
没有默认主题，需要createTheme/ThemeProvider |
带有默认的材料主题（与其他计划的主题相反） |
| 传统造型包 | 取决于新@mui/system包 |
| 由 JSS 提供支持 | 由情感驱动（作为默认样式引擎） |
有makeStyles/withStyles |
没有makeStyles/ withStyles，styled而是有 |
你不应该@mui/styles与@mui/material/styles. 选择一种样式解决方案并坚持下去，因为来自不同样式库的重复类名会导致意外的副作用和难以发现的错误。如果你正在创建一个新项目或有一个小的 v4 项目，我建议完全迁移到情绪解决方案以避免增加额外的包大小，因为 MUI 组件使用情绪，而不是新版本中的 JSS。