tailwindcss icon indicating copy to clipboard operation
tailwindcss copied to clipboard

Half value class(f.e. p-0.5) automatically add same zero class(p-0)

Open artur-demidov opened this issue 1 year ago • 1 comments

Tailwindcss 3.1.8 Engine: playground/vite + react Describe: if you add a class for a half value, then the class of the zero value automatically goes into the bundle Снимок экрана 2022-09-17 в 18 50 59

artur-demidov avatar Sep 17 '22 15:09 artur-demidov

yield /[^<>"'`\s.(){}[\]#=%$]*[^<>"'`\s.(){}[\]#=%:$]/g
//              ╰───────               ╰────────

I try to remove these dot here of defaultExtractor() and solve this problem,but there are two tests failed: markdown and slim

I think we can provide some extension-specific extractor(html, md, tsx...) so we can also reduce the number of candidates to get some performance improvement

lzt1008 avatar Sep 18 '22 15:09 lzt1008

Hey! So, at least for now, this behavior is an intentional side-effect of supporting both Slim and class lists in backticks (like used in markdown, for example) — which is why the tests pointed out by @lzt1008 fail.

Since Tailwind CSS does not parse your source files, at least when reading Slim files, .p-0.5 is ambiguous as it could could be either p-0.5 or p-0 and 5. So, for the purposes of Tailwind CSS, it is both. This results in a minor increase in file size for better flexibility and less need for configuration. If you want to adjust this for your own project we have documentation on how to customize the extraction logic.

It may be in the future that we'd provide more specific extractors but that even can be quite complicated because how syntax for different languages can be mixed. For instance, a pure HTML extractor may not pick up everything that would be needed inside <script> tags.

thecrypticace avatar Sep 21 '22 17:09 thecrypticace