Aprenda a fazer o setup completo de Tailwind CSS para o seu projeto!
⭐ Conheça nossos cursos: horadecodar.co...
Tailwind CSS é uma biblioteca de CSS de utilitário que possibilita que os desenvolvedores construam designs responsivos. A instalação é relativamente simples e pode ser feita de várias maneiras, mas a mais comum é através do Node.js e do npm (Node Package Manager).
Primeiro, você instala o pacote tailwindcss em seu projeto com o comando npm install -D tailwindcss. Em seguida, inicialize o arquivo de configuração usando npx tailwindcss init. Esse comando cria um tailwind.config.js no diretório raiz do seu projeto, onde você pode personalizar as configurações.
O arquivo tailwind.config.js também possibilita especificar quais arquivos HTML ou JS devem ser escaneados em busca de classes Tailwind. Você faz isso adicionando os caminhos apropriados no campo content.
Depois de configurar, você pode adicionar diretivas Tailwind ao seu arquivo CSS principal para importar estilos. Essas diretivas (@tailwind base, @tailwind components, @tailwind utilities) importam diferentes camadas de estilo do Tailwind para o seu arquivo CSS.
Assim, com a CLI do Tailwind e a configuração adequada, você pode gerar um arquivo CSS otimizado que contém apenas as classes que você realmente usou em seu projeto, tornando-o rápido para carregar.
Veja tudo em nosso vídeo! E, claro, não esquece de se inscrever no canal do RU-vid da Hora de Codar!
🟣 Discord Hora de Codar: / discord
🔴 Instagram: / horadecodar
🔷 Telegram: t.me/horadecodar
26 сен 2024