Material UI css加载顺序

Question

我很难理解我应该如何构建我的项目。我正在使用材质 UI 和 css 模块进行反应。问题是天知道为什么，来自 MUI 的所有样式都在标题的底部加载，与 css 模块样式相同。经过一番研究，我找到了两个解决方案：

1. 在 css 模块中使用 !important 这很糟糕。
2. 更改注入顺序https://material-ui.com/guides/interoperability/#css-modules

第二个问题是，在多组件项目中，每次引入新组件时都必须像示例中那样手动加载它，这将是非常乏味的。我错过了一些明显的东西吗？您对如何更轻松地更改加载顺序有任何想法吗？

Answer 1

根据Material-UI 文档，您应该添加一个<StylesProvider/>组件，它包装您的组件树。

import { StylesProvider } from '@material-ui/core/styles';

<StylesProvider injectFirst>
  {/* Your component tree.
      Styled components can override Material-UI's styles. */}
</StylesProvider>

如果injectFirst设置（true当然），Material UI 样式标签将首先注入头部（优先级较低）