Sass @apply not recognizing tailwindcss utility classes [Next JS]

[Emii-lia]

When I use @apply inside an scss file, other than the global, it returns an error "Error: Cannot apply unknown utility class: gap-2". Then I imported tailwindcss inside the file and it works fine ; however I don't want to import tailwindcss in every scss file I use ; the v3 just handled it properly back then.

I also read the documentation saying that you also have to import the global style, where the themes are stored in order to use them in another stylesheet file... that's a lot to do just for making tailwindcss fully works.

Before v4 I always put my styles in a scss file and use @apply for styling since it's faster than doing css and I also don't want to use inline classes directly applied inside the view template because it can make the code messy.

[aryairama]

I also have the same problem

[rozsazoltan]

Keep in mind that v4 no longer supports the Sass, Less, and Stylus preprocessors.

• https://tailwindcss.com/docs/upgrade-guide#using-sass-less-and-stylus