Tailwindcss with postcss and css modules

Question

I was thinking that Tailwind CSS with CSS modules / post css will work nicely together. to write less code and generate less CSS but...

when I used tailwind with @apply it just applies styles to that class

example

.root {
  @apply flex align-center;
}

from styles.root to "root flex align-center" but instead it just add css to .root class

I think that it should work as composes: flex align-center from global;

Is my configuration wrong or it's just working in that way?

user_1870780 · Answer

That is just how the @apply directive works. @apply is used to inline any existing utility classes into your own custom CSS.

/* Input */
.root {
    @apply flex items-center;
}

/* Output */
.root {
    display: flex;
    align-items: center;
}