React-Admin - 添加材质 ui 主题将特定 css 选择器覆盖为全局

Question

在 React-Admin 中，我试图在我的 Material UI 主题中应用某些 CSS 代码作为全局属性。就在我创建主题时，我已经在我的覆盖中添加了这些行：

overrides: {
    "@global": {
        "[class*='RaLayout-content']": {
            overflow: "auto !important",
            maxWidth: "100vw !important",
        },
    },

在整个管理员中，我有许多类，例如：RaLayout-content-4、RaLayout-content-221、RaLayout-content-31，它们由 React-Admin 生成，我想在每个包含 @987654325 的元素中应用这些 css 行@类。

由于 Heroku deploy 的类名最小化，我无法在 index.css 中编写这些 css 行，因为它们在最小化后将不适用。

这是我之前在 index.css 文件中实现它们的方式（仅在开发模式下工作）：

[class*="RaLayout-content"] {
  overflow: auto !important;
  max-width: 100vw !important;
}

注意：我也一直在尝试添加 MuiCssBaseLine，但没有成功。

提前致谢！

Answer 1

我认为你可以用

覆盖主题

overrides: {
  RaLayout: {
    content: {
      // your overrides
    },
  },
  ...
}