Блог

я пытаюсь найти некоторые инструменты, которые могут помочь мне с некоторыми проблемами форматирования кода. Я пытаюсь разделить наборы правил css на логические блоки, но на самом деле я не могу найти никаких инструментов для этого, я проверяю такие инструменты, как prettier, stylefmt, http://csscomb.com и другое.

еще одна проблема: мы используем css-модули, поэтому csscomb, например, не может работать с такими свойствами, как composes , @value и подобными селекторами .селектор a: глобальный .селектор-b

можете ли вы помочь мне с этой проблемой, в каком направлении я должен посмотреть? Спасибо ( и извините за мой английский)

 .selector {
   position: absolute;
   content: '';

   left: 0;
   right: 0;
   top: 0;
   bottom: 0;

   margin-top: 2em;
   margin-bottom: 5em;
}
  

Для достижения этой цели вы можете использовать stylelint и плагин для упорядочения stylelint. Он может обрабатывать нестандартные псевдоклассы, такие как :global , свойства, подобные composes , и at-правила, подобные @value .

В плагине stylelint order есть два правила, которые вы можете использовать вместе:

• свойства-порядок
• порядок

Первое позволит вам упорядочивать и группировать ваши свойства. Вы можете либо создать свой собственный порядок и группы, либо использовать конфигурацию сообщества.

Последнее позволит вам определять порядок at-правил, пользовательских свойств, объявлений и вложенных правил (и других) в правилах.