Instalar Tailwind CSS con Meteor

Configurando Tailwind CSS en un proyecto Meteor.

Comienza creando un nuevo proyecto Meteor si aún no tienes uno configurado. El enfoque más común es usar el CLI de Meteor.

Terminal

npx meteor create my-project
cd my-project

Instala @tailwindcss/postcss y sus dependencias peer a través de npm.

Terminal

npm install tailwindcss @tailwindcss/postcss postcss postcss-load-config

Crea un archivo postcss.config.mjs en la raíz de tu proyecto y añade el plugin @tailwindcss/postcss a tu configuración de PostCSS.

postcss.config.mjs

export default {
  plugins: {
    "@tailwindcss/postcss": {},
  },
};

Añade un @import para Tailwind CSS a tu archivo ./client/main.css.

main.css

@import "tailwindcss";

Ejecuta tu proceso de build con npm run start.

Terminal

npm run start

Comienza a usar las clases de utilidad de Tailwind para estilizar tu contenido.

App.jsx

export const App = () => (
  <h1 className="text-3xl font-bold underline">
    Hello world!
  </h1>
)