Skip to content
This repository was archived by the owner on Apr 6, 2021. It is now read-only.

Wrong output order when using multiple @apply rules #148

Closed
sboerrigter opened this issue Mar 23, 2021 · 1 comment · Fixed by #151
Closed

Wrong output order when using multiple @apply rules #148

sboerrigter opened this issue Mar 23, 2021 · 1 comment · Fixed by #151

Comments

@sboerrigter
Copy link

sboerrigter commented Mar 23, 2021

What version of @tailwindcss/jit are you using?

v0.1.7

What version of Node.js are you using?

v.15.something

What browser are you using?

Chrome

What operating system are you using?

macOs

I noticed that the CSS output is in the wrong order if you use multiple @apply rules like this:

h1 {
  @apply text-2xl;
  @apply sm:text-3xl;
}

With this example the sm:text-3xl rule is overwritten by text-2xl.

It does work as expected when I combine the rules in one @apply statement like this:

h1 {
  @apply text-2xl sm:text-3xl;
}

I wasn't sure if this is related to existing issues about @apply. If so, sorry for the duplicate issue 🙃.

@adamwathan
Copy link
Member

Hey thanks for reporting! I am not totally surprised by this, definitely some things to iron out here. Will try and take a look this week!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants