[JIT] prefix as a function breaks some classes

[quentinlagache]

What version of Tailwind CSS are you using?
2.2.15

Reproduction URL
https://play.tailwindcss.com/GlwsJggWJP?file=config

Describe your issue
When using prefix as a function to apply prefix only on some classes, it seems that classes with one character base name like m-2, p-5, w-full and negative ones like -rotate-6 are not generated.

Add prefix (selector) { return ''; } to tailwind config is breaking the output.

[Soviut]

I can't reproduce. Your example seems to work for the classes you mentioned.

I tried the following

  prefix(selector) {
    console.log(selector)
    return ''
  },

And this printed out all the classes, including the ones you mentioned.

including negatives

[quentinlagache]

Thanks for your input and interest regarding this issue @Soviut.

The issue is shown on the Tailwind Play link attached so I'm confident it's not only an issue with my codebase (I'm relying on @tailwindcss/postcss7-compat)
You can highlight it by applying/removing the following code from the config file:

prefix (selector) { return ''; },

[Soviut]

@quentinlagache Ah, I misunderstood. The following is NOT the desired output. I was focusing on the classes in the selector too much.

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

I've been looking into this and wrote a more in-depth explanation here: #5829
What I would recommend you to do is to use the prefix as a string instead of a function.

[quentinlagache]

Hey @RobinMalfait !
I dug into your explanation and really appreciate how far you push it and all details you provide to explain the issue and how you will sort this in the JIT world. It's real insights into Tailwind development and a very instructive reading 🙌

In the end, I get a better sense of why prefix as a function is more of a hacky solution in this regard and the lack of consistency it brings to outputted classes.

In my case I will handle it outside of tailwind to keep prefix free tailwind classes.

Thanks for your awesome work 🙏