How can I enable tailwind intelliSense outside of “className”?

I realize this Q is old, but it still shows up in search so I wanted to share my workflow 🙂

Here’s my VS Code settings.json to add Tailwind IntelliSense within objects and variables who’s name ends with “Classes”:

  "tailwindCSS.experimental.classRegex": [
    ["Classes \\=([^;]*);", "'([^']*)'"],
    ["Classes \\=([^;]*);", "\"([^\"]*)\""],
    ["Classes \\=([^;]*);", "\\`([^\\`]*)\\`"]
  ],

Tailwind IntelliSense will now recognize all of the following strings:

const defaultClasses = `text-grey`;

const componentClasses = {
  default: 'text-grey',
  danger: `text-red`,
  warning: "text-yellow",
};

Note: the regex matches code blocks that start with Classes = and ends with ; — you can replace Classes = with your own matcher, like. cntl 🙂

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)