¿Por qué utilizar un editor de código?
Los editores de código pueden mejorar la experiencia del programador mediante distintas funcionalidades como autocompletado, exploración del proyecto, reporte de errores, etc.
Soporte para sintaxis de Tailwind CSS
Tailwind utiliza muchas reglas de css como @tailwind
, @apply
y @screen
. En mucho editores esto puede mostrarse como alertas o errores cuando la sintaxis no es reconocida.
Para solucionar este problema podemos instalar un plugin que permita a nuestro editor soportar PostCSS en lugar de solo CSS.
Si estas utilizando Visual Studio Code, puede utilizar el Tailwind CSS IntelliSense que incluye el soporte para las sintaxis de todas las reglas que existen en Tailwind CSS.
Intellisense para VS Code
El plugin oficial Tailwind CSS IntelliSense mejora la experiencia al proveer características avanzadas como el autocompletado y el linting.
Característica | Descripción |
---|---|
Autocompletado | Provee sugerencias para nombres de clases, así como funciones y directivas de CSS. |
Linting | Potenciales errores y fallos que se encuentran en las sintaxis de cSS. |
Previsualización | Muestra el CSS correspondiente para una clase del Tailwind CSS al posicionar el cursor sobre ella. |
Coloreado | Provee combinaciones de colores específicos a los elementos de la sintaxis. |
Ordenamiento de clases con Prettier
El Plugin de formateo con Prettier de Tailwind CSS organiza las clases según las convenciones provistas por Tailwind CSS.
Plugins de JetBrains
Los ides de JetBrains como WebStorm, PhpStorm y otros, incluyen soporte para Tailwind CSS dentro del código HTML, para mas información consulta la Página de información de soporte de Tailwind CSS.