Material-UI 生产构建生成与开发中不同的样式订单定义

Question

使用material-ui，生产build与开发build不同：生产中生成的material-ui样式是与开发中的定义顺序不同。

在 DEV 中，HTML head 标签按以下顺序包含 material-ui 样式：

• 米ui纸
• MuiTouchRipple
• MuiButtonBase
• Mui按钮
• [...]

在 PROD 中，HTML head 标签按以下顺序包含 material-ui 样式：

• Mui按钮
• MuiButtonBase
• Mui图标
• Mui菜单
• [...]

因此在生产中，它破坏了样式：material-ui 自己的样式相互覆盖...

更多上下文：

• Material-ui用于4.11.3
版本
• 包裹用于制作build
• 自定义 makeStyles 未使用（所以我不关心 解决方案）
• 我尝试了此处描述的解决方案但没有成功：https://material-ui.com/getting-started/faq/#why-arent-my-components-rendering-correctly-in-production-builds => 我创建了一个 generateClassName 实例并将其传递给组件树顶部使用的 StylesProvider（此解决方案没有效果）
• @material-ui/styles 未使用

我的问题：如何确保 material-ui 样式在开发和生产中以相同的方式呈现？

Answer 1

解决方案实际上是升级到 Material-ui 的 v5：https://next.material-ui.com/guides/migration-v4/

根本问题似乎与 Material-ui v4 没有正确处理 tree-shaking 有关：https://github.com/mui-org/material-ui/issues/16609