shadcn-ui/lint

Что это?

Ключевые возможности

• 01Запрещает переопределять className у компонентов с помощью контрактов для каждого компонента.
• 02Запрещает произвольные значения и прямое указание цветов, предлагая вместо них токены темы.
• 03Предлагает исправления с учётом размеров, вариантов и файлов темы проекта.
• 04Работает с ESLint и Oxlint, поддерживает React, Vue и Svelte.
• 05Не требует shadcn/ui и умеет находить импорты пользовательских компонентов.

Сценарии использования

• Не позволяет AI-агентам менять стили общих UI-компонентов в кодовой базе на Tailwind.
• Помогает соблюдать заданные темой отступы и цвета во всей дизайн-системе команды.
• Позволяет применять правила дизайн-системы к сторонним пакетам компонентов и пакетам в монорепозитории без форка.

Быстрый старт

1. 1

   Установите пакет и ESLint с помощью npm

   npm install -D @shadcn/lint eslint @typescript-eslint/parser
2. 2

   Создайте eslint.config.mjs с плагином и правилом (см. README)

3. 3

   Запустите линтер

   npx eslint .

Что важно знать

• !Работает только с проектами на Tailwind v4.
• !Oxlint читает только блоки script в файлах Vue и Svelte, но не разметку.
• !Требуется Node.js версии 20.19 или новее.

Темы

Частые вопросы

Что такое lint?

Линтер для Tailwind-дизайн-систем, ориентированный на AI-агентов: задавайте допустимые правила стилизации и получайте исправления на основе компонентов и темы проекта. @shadcn/lint — линтер для проектов на Tailwind v4, который проверяет UI-код на соответствие правилам дизайн-системы. Вы задаёте, какая стилизация разрешена: например, запрещаете переопределять className у Button, использовать произвольные значения вроде p-[13px] или указывать цвета напрямую. При нарушении правила линтер объясняет проблему и предлагает альтернативу на основе компонентов, вариантов и темы проекта.

lint можно использовать бесплатно? Какая у него лицензия?

lint распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.

lint всё ещё поддерживается?

Активно поддерживается. Последний коммит в lint — 19 окт. 2026 г..

Для чего можно использовать lint?

Не позволяет AI-агентам менять стили общих UI-компонентов в кодовой базе на Tailwind. Помогает соблюдать заданные темой отступы и цвета во всей дизайн-системе команды. Позволяет применять правила дизайн-системы к сторонним пакетам компонентов и пакетам в монорепозитории без форка.

Как установить lint?

Установите пакет и ESLint с помощью npm: npm install -D @shadcn/lint eslint @typescript-eslint/parser Создайте eslint.config.mjs с плагином и правилом (см. README) Запустите линтер: npx eslint .

Где скачать lint?

Исходный код и инструкции по установке — на GitHub: https://github.com/shadcn-ui/lint