Howdy!

Currently, when you mis-@apply a class name, the error message doesn't help you figure out what you might have been trying to type instead. For instance, I get bit by this one all of the time 馃憞

/* 馃槺 */
body {
  @apply anti-aliased;
}

@apply cannot be used with .anti-aliased because .anti-aliased either cannot be found, or its actual definition includes a pseudo-selector like :hover, :active, etc. If you're sure that .anti-aliased exists, make sure that any @import statements are being properly processed before Tailwind CSS sees your CSS, as @apply can only be used for classes in the same CSS tree.

I think we can make this error message even more helpful with one extra line...

Did you mean .antialiased?

To this end, I've added some very na茂ve logic to the applyComplexClasses.js module, such that it compares the given class (that's being @apply'ed) against the list of all available classes with the assistance of the library DidYouMean.js.

In fact, I was inspired by @yuki24's amazing work on https://github.com/ruby/did_you_mean, and would welcome his suggestions for actually implementing this in a sophisticated way, should this feature sound interesting to the Tailwind team.

Open Questions

• What happens if multiple suggestions are recommended?
• Is this library fast enough, or will this significantly slow down compilation?

Thanks for all your hard work 鉂わ笍