group / group-hover is recognized as custom class

[wiesson]

I'm getting this error

The group class does not exist. If group is a custom class, make sure it is defined within a @layer directive.

I'm using it as described here - https://tailwindcss.com/docs/hover-focus-and-other-states#group-hover - so to me, group is not a custom class - any recommendations here?

[SMontiel]

Same error, here

Base CSS:

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    ...
    tr {
        @apply group;
    }
    ...

Log:

The `group` class does not exist. If `group` is a custom class, make sure it is defined within a `@layer` directive.

   9 | 
  10 |     tr {
> 11 |         @apply group;
     |         ^
  12 |     }
  13 | 

    at processResult (/.../node_modules/webpack/lib/NormalModule.js:597:19)
    at /.../node_modules/webpack/lib/NormalModule.js:691:5
    at /.../node_modules/loader-runner/lib/LoaderRunner.js:399:11
    at /.../node_modules/loader-runner/lib/LoaderRunner.js:251:18
    at context.callback (/.../node_modules/loader-runner/lib/LoaderRunner.js:124:13)
    at Object.loader (/.../node_modules/postcss-loader/dist/index.js:102:7)

[adamwathan]

Hey! This is by design at the moment, you never want to @apply the group class, it will not give you the results you expect:

tailwindlabs/tailwindcss#2848 (comment)

[SMontiel]

Thanks, @adamwathan and @simonswiss.

Good work, btw