Как указать порядок, в котором таблицы стилей появляются в документе?

У меня есть несколько стилизованных компонентов, используя withStyles HOC, чтобы экспортировать их, но я не могу переопределить некоторые правила, потому что jss смешивает порядок стилей mui с таблицами стилей моего компонента.

Как я могу подтолкнуть мои стили до конца?

Источник

2 ответа

Решение

Я и моя команда тоже наткнулись на это, и нам удалось найти решение. По-видимому, с помощью Style, принимает параметр объекта в качестве параметра. Таким образом, чтобы решить эту проблему, вам нужно передать индекс параметра со значением 1. Итак, что вы получаете это:

withStyles(styles, {index: 1})(yourComponent)
Источник

Это описано здесь в документации по библиотеке материалов UI.

Порядок внедрения CSS
CSS, введенный Material-UI для стилизации компонента, обладает максимально возможной специфичностью, так как <link> вводится в нижней части <head> чтобы компоненты всегда правильно отображались.

Однако вы можете также переопределить эти стили, например, с помощью styled-components. Если вы столкнулись с проблемой порядка внедрения CSS, JSS предоставляет механизм для решения этой ситуации. Регулируя размещение insertionPoint в вашей HTML-главе вы можете контролировать порядок применения правил CSS к вашим компонентам.

По сути, вы создаете точку внедрения, а затем заставляете JSS использовать ее для вставки стилей. Возможные варианты включают создание комментария HTML, создание элемента HTML и использование Javascript для создания комментария в HTML (как create-react-app снимает комментарий в производстве)

Источник
Другие вопросы по тегам