[Utility class] class doesn't exist. If `[Utility class]` is a custom class, make sure it is defined within a `@layer` directive.
See original GitHub issueI have created a StackBlitz reproduction of the issue.
Describe the bug:
I had TailwindCSS version ^3.0.5 and wanted to upgrade to ^3.0.13. After upgrade, I saw a couple of errors in my console.
Specifically, Tailwind is not able to recognize @layer utilities with @apply anymore.
Steps to reproduce:
- Open the minimal reproduction
- See in
HelloWorld.vuethat I have@apply my-custom-class - Then open
src/css/tailwind.cssand see thatmy-custom-classis defined under@layer utilities - Run the app and Observe the error
Issue Analytics
- State:
- Created 2 years ago
- Reactions:3
- Comments:6 (1 by maintainers)
Top Results From Across the Web
the `@apply` class does not exist. if `@apply` is a custom ...
The text-paragraph class does not exist. If text-paragraph is a custom class, make sure it is defined within a @layer directive. E:/XAMPP/htdocs ...
Read more >Why it says the `hover:` class does not exist. If ... - Stack Overflow
My project throw error like "The hover: class does not exist. If hover: is a custom class, make sure it is defined within...
Read more >Organize your CSS in the Tailwind style with @layer directive
Tailwind provides a @layer directive to help you better organize your CSS. ... The utilities layer is for small, single-purpose classes that ...
Read more >Functions & Directives - Tailwind CSS
A reference for the custom functions and directives Tailwind exposes to your CSS.
Read more >Tailwindcss SCSS error @apply class does not exist issue
I recently upgraded to tailwind 2 and I made sure to follow the upgrade guide for laravel. I'm using SCSS in my project...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I also have broken classes from
@layer utilitiesin@applyafter upgrading from"tailwindcss": "^3.0.8"to"tailwindcss": "^3.0.15".Why is such big breaking change introduced in such minor patch? Or is it a bug?
it was due to my bad usage of tailwind config. I wasn’t using the “extend” property, so It overwrote the whole base config