search

postcss / postcss-nested

PostCSS plugin to unwrap nested rules like how Sass does it.
MIT License
1.15k stars 66 forks source link

I cannot @apply classes with nested elements #124

Closed SergiArias closed 1 year ago

SergiArias commented 3 years ago

Hello!

I come from tailwind docs where they recommend this plugin so I don't have to use scss.

The problem (that doesn't happen in scss) is that if I create a class like so and then apply it:

  .btn-outline {
    &::before {
      @apply opacity-0 scale-x-50 duration-500;
    }
  }

  .btn-outline-primary {
    @apply btn-outline text-primary;
  }

Then the @apply doesn't work, but the btn-outline class works. I guess that the problem is the order in which each plugin is processing the info. Is this a bug or a expected behaviour? Is there any workaround?

In scss it works because postcss is applied after scss has generated the css file.

ai commented 3 years ago

It happens because we need to migrate postcss-nested to new PostCSS 8 events (Rule instead of OnceExit), but I do not have time to do it.

I will be glad if somebody will send a PR.

SergiArias commented 3 years ago

I don't even know where to start, but I hope someone who does can PR. Thanks!!

SergeAstapov commented 3 years ago

Looks like RuleExit was replaced by Rule in #116 (Big Thanks to @rluba), which wad part of v5.0.3 release.

@SergiArias mind to re-check on your side? (TBH not sure it's the fix for the same issues, but really looks similar)

ai commented 3 years ago

Can you try 5.0.6 release. The bug may be fixed by @bsak-shell in https://github.com/postcss/postcss-nested/pull/137

maranomynet commented 1 year ago

This seems to be fixed.