O que é
O @shadcn/lint é um linter focado em sistemas de design Tailwind, desenvolvido para interagir com agentes de código. A ferramenta permite definir e aplicar regras de estilo do seu projeto. Quando um agente viola uma regra, a mensagem de erro detalha a falha e orienta a correção usando os componentes, variantes e temas já existentes.
Para quem serve
Serve para pessoas desenvolvedoras que trabalham com agentes de IA em projetos com Tailwind v4. O @shadcn/lint funciona com ESLint e Oxlint, sendo compatível com React, Svelte e Vue. Não é necessário utilizar a biblioteca shadcn/ui para usá-lo. É útil para manter a consistência de componentes, permitindo restringir reestilizações indesejadas e barrar valores arbitrários sem alterar a API dos componentes existentes.
Como começar
Você pode iniciar passando a documentação de instalação (SETUP.md) diretamente para o seu agente de código ou fazendo a instalação manual no seu projeto. Em seguida, basta configurar as regras desejadas no seu arquivo de linter (ESLint ou Oxlint). Entre as regras disponíveis estão a shadcn/no-restyle, que define quais propriedades podem ser alteradas em cada componente, e a shadcn/no-arbitrary-values, que exige o uso de escalas do tema.
Instalação
npm install -D @shadcn/lint eslint @typescript-eslint/parser
🔗 Repositório oficial: https://github.com/shadcn-ui/lint
Veja em 1 minuto
📚 Mais conteúdos do canal: https://gist.github.com/VictorHugodaSilvaSousa/d1e955e97cd27fc662351821d0a3fdbe
Top comments (0)