Улучшите отладку с помощью StyleX DevTools
StyleX DevTools — это бесплатное расширение для Chrome, предназначенное для разработчиков, работающих с атомарными стилями. Этот инструмент улучшает стандартную панель элементов, вводя специальную панель «Стили», которая организует стили по свойствам, а не по селекторам. Эта организация позволяет более эффективно управлять стилями, обеспечивая, чтобы изменения применялись только к текущему элементу, тем самым минимизируя риск непреднамеренных глобальных изменений. Расширение также предлагает существующие стили для облегчения замены имен классов и использует встроенные стили для любых новых стилей, не найденных в файле CSS. Кроме того, оно предоставляет простой способ сбросить переопределения стилей, если это необходимо.
Лучшая рекомендуемая альтернатива
Специально разработанное для StyleX, это расширение обнаруживает атрибуты `data-style-src` в режиме разработки, позволяя пользователям легко отслеживать источник стилей. Оно позволяет одним щелчком перейти к соответствующему файлу JS/TS в инструментах разработчика, упрощая процесс отладки. Более того, пользователи могут видеть объекты стилей, примененные в точном порядке их отображения, обеспечивая ясность и контроль над их атомарным стилем.
