是否可以在 MaterialUI 中为样式化组件使用自定义类名生成器？答案

【问题标题】：Is it possible to use a custom class name generator for styled components in MaterialUI?是否可以在 MaterialUI 中为样式化组件使用自定义类名生成器？
【发布时间】：2020-02-06 22:07:03
【问题描述】：

我正在使用带有 MaterialUI 的未弹出的 create-react-app 项目，并尝试用 Styled Components 替换 JSS。它工作正常，但生成的类名不可读。

我读到您可以使用 babel 插件来执行此操作，但我无法在不弹出项目的情况下更改 Babel 配置。我知道您可以向StylesProvider 提供自定义类名生成器函数来生成JSS 类名。样式化组件是否有类似的机制，可以让我在不弹出项目的情况下更改类名？

【问题讨论】：

你可以看看react-app-rewired。它使您能够在不弹出的情况下修改 webpack 配置。

标签： reactjs material-ui styled-components jss

【解决方案1】：

基本上是这样导入的，用宏：

import styled from "styled-components/macro";

它具有与插件相同的功能，请查看文档： https://www.styled-components.com/docs/tooling#babel-macro

这里的例子： https://codesandbox.io/s/nostalgic-sea-8m3q1?fontsize=14

【讨论】：