Failed to detect when using multi-line classes with CRLF

Apologies for writing here, this may be partly an issue or it may be misunderstanding. Building my app for production today and a seemingly random selection of styles weren’t compiling through. Everything works fine using npm run dev but breaks using ‘npm run build’. Adding the missing styles to safelist has fixed things, but I’m left confused as to what needs does and does not need adding and why.

Here’s a snippet:

<div class="absolute z-20 top-1/3 w-full rounded-xl border-t-10 bg-light-blue-50
  border-light-blue-200 dark:bg-gray-700 dark:border-gray-500 -mx-1 md:-mx-2">
  ...
</div>

In dev mode, everything works, but in production the following styles don’t compile through: top-1/3 border-t-10 border-light-blue-200 rounded-xl -mx-1 md:-mx-2. So I add all these to safelist and everything works.

What’s confusing especially is why border-light-blue-200 doesn’t work, also dark:border-gray-500 doesn’t work unless border-light-blue-200 is in safelist. Also rounded-xl, the negative -mx-1, and why md:-mx-2 needs to be prefixed by the screen breakpoint.

On a more general note it seems fairly arbitrary what works and what doesn’t and having to add everything to safelist doesn’t really seem like a good approach. Or I’m totally confused, help please!

[antfu]

@qgates can you verify if it still occur in 0.15.10? Thanks

[qgates]

@antfu 0.15.10 has fixed the issue, nice and fast again with updates in dev mode. Also tested with production build for the original issue and everything is correct. Many thanks 🙂