Tailwindcss Adding component classes does not work

[igorovic]

What version of astro are you using?

1.0.6

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

pnpm

What operating system are you using?

Mac

Describe the Bug

According to tailwindcss documentation you should be able to create a custom component class. example doc

I tested with this simple example:

@components {
  .issue-1 {
    @apply bg-red-400;
    outline: 1px solid red;
  }
}

The problem is that this @components directive should be striped away in the final css. However, with astro tailwind integration it's not the case.

Here is a screenshot of the final result with astro.

Link to Minimal Reproducible Example

https://github.com/igorovic/learn-astro

Participation

• I am willing to submit a pull request for this issue.

[DerYeger]

Can you try @layer components as seen here?

[bluwy]

I think @DerYeger is right here, and the docs linked also recommends @layer components. I think it's a typo so I'll close this for now. Feel free to let me know if I'm mistaken though!