Poimen / stencil-tailwind-plugin

Plugin for using tailwindcss with StencilJS
https://www.npmjs.com/package/stencil-tailwind-plugin
MIT License
51 stars 5 forks source link

Add way to include Autoprefixer plugin #4

Closed bradlc closed 3 years ago

bradlc commented 3 years ago

Original issue: https://github.com/tailwindlabs/tailwindcss/issues/5296

As far as I can tell there's currently no way to run the Tailwind output through additional PostCSS plugins, but some classes need vendor prefixes to work in certain browsers, e.g. bg-clip-text

It would be nice if you could specify additional PostCSS plugins. Alternatively, Autoprefixer could be added by default, similar to how postcss-import and cssnano are already.

Poimen commented 3 years ago

I have been having some fun with postcss and passing the output to further postcss plugins in the chaining of stencil. I was wanting to try an attempt to pass the tw classes to be triggered further down the line, but I have seen some funky behaviour with things like cssnano and @apply rules - as in cssnano delete's the @apply rules and bundles all the rules into a single rule, even though @apply is different across all the rules.

I'll have a look into this shortly

Poimen commented 3 years ago

autoprefixer should now be applied as expected with default configuration.

I have also added the ability to override the complete postcss config if required.

The stencil pipeline is requiring more understanding to try to pass tailwind styles over to it.