Изменения имени классов Material-UI при сборке, добавляет идентификаторы к каждому имени класса, которые переопределяются пользователем

Question

Проблема в том, что когда использовались классы = {{бла-бла}}, он работал локально, а имена классов материалов по умолчанию не имели идентификаторов. Но на какой-то другой машине css сломался, после проверки того, что пошло не так, я узнал, что генератор className или что-то, чего я не знаю, изменил мои переопределения, добавив счетчик к номеру classNames, который я использовал. Так что теперь это выглядит примерно так:

Теперь я не хочу переписывать CSS снова и не могу, потому что именно так вы переопределяетеМуи классы. Производственная сборка отстой.

'& .MuiSelect-blah': {немного css * wooosh}

Answer 1

Попробуйте в главном файле приложения:

 import React from 'react';
 import { StylesProvider, createGenerateClassName } from '@material-ui/core/styles';

 const generateClassName = createGenerateClassName({
   productionPrefix: 'some',
 });

 export default function App() {
    return (
     <StylesProvider generateClassName={generateClassName}>...</StylesProvider>
   );
 }