francoismassart / eslint-plugin-tailwindcss

ESLint plugin for Tailwind CSS usage
https://www.npmjs.com/package/eslint-plugin-tailwindcss
MIT License
1.5k stars 71 forks source link

[Feature request] Check no-custom-classname rules with '@apply' tag in css files #141

Open bas00445 opened 2 years ago

bas00445 commented 2 years ago

Is your feature request related to a problem? Please describe. In my project, I'm using @apply tag in CSS files in some situations. I want to know whether this plugin can detect there is no className in CSS files or if any solutions available?

This is my .eslintrc.json

{
  "plugins": ["tailwindcss"],
  "rules": {
    "testing-library/no-node-access": "off",
    "@next/next/no-html-link-for-pages": "off",
    "react/destructuring-assignment": "off",
    "@next/next/no-img-element": "off",
    "tailwindcss/no-custom-classname": [
      "error",
      {
        "callees": ["clsx"],
        "config": "tailwind.config.js",
        "cssFiles": [
          "!**/node_modules",
          "!**/.*",
          "!**/dist",
          "!**/build",
          "src/styles/{fonts,global}.css",
          "src/components/**/*.css"
        ]
      }
    ]
  }
}

Describe the solution you'd like I want this plugin to support @apply tag in CSS files to check no-custom-classname rules

image
its-monotype commented 2 years ago

Can this plugin validate classes inside scss modules in @apply?

AmruthPillai commented 2 years ago

Also curious about .scss/.less support, any way we could include those as well, through some sort of glob pattern config?

ItsTarik commented 1 week ago

Normally the cssFiles config should handle this but i don't understand why its not working ? @francoismassart Any idea about this bug ?