{"id":13759970,"url":"https://github.com/francoismassart/eslint-plugin-tailwindcss","last_synced_at":"2026-05-27T14:11:39.863Z","repository":{"id":37274930,"uuid":"350840995","full_name":"francoismassart/eslint-plugin-tailwindcss","owner":"francoismassart","description":"ESLint plugin for Tailwind CSS usage","archived":false,"fork":false,"pushed_at":"2026-05-21T14:31:27.000Z","size":1360,"stargazers_count":2060,"open_issues_count":137,"forks_count":110,"subscribers_count":13,"default_branch":"master","last_synced_at":"2026-05-21T16:40:32.568Z","etag":null,"topics":["eslint-plugin","rules","tailwind","tailwindcss"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/eslint-plugin-tailwindcss","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/francoismassart.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":["francoismassart"],"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":["https://thanks.dev/r/gh/francoismassart"]}},"created_at":"2021-03-23T19:59:32.000Z","updated_at":"2026-05-21T01:16:55.000Z","dependencies_parsed_at":"2024-02-01T14:44:35.579Z","dependency_job_id":"a76675a3-0f33-4365-8a4f-c14b10594117","html_url":"https://github.com/francoismassart/eslint-plugin-tailwindcss","commit_stats":{"total_commits":374,"total_committers":31,"mean_commits":"12.064516129032258","dds":0.09893048128342241,"last_synced_commit":"6dd917e869846a970170fe12eb73353cbd314597"},"previous_names":[],"tags_count":126,"template":false,"template_full_name":null,"purl":"pkg:github/francoismassart/eslint-plugin-tailwindcss","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/francoismassart%2Feslint-plugin-tailwindcss","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/francoismassart%2Feslint-plugin-tailwindcss/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/francoismassart%2Feslint-plugin-tailwindcss/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/francoismassart%2Feslint-plugin-tailwindcss/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/francoismassart","download_url":"https://codeload.github.com/francoismassart/eslint-plugin-tailwindcss/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/francoismassart%2Feslint-plugin-tailwindcss/sbom","scorecard":{"id":24575,"data":{"date":"2025-08-04","repo":{"name":"github.com/francoismassart/eslint-plugin-tailwindcss","commit":"29bee22a691d7280a2210b046b37802806a307f1"},"scorecard":{"version":"v5.2.1-28-gc1d103a9","commit":"c1d103a9bb9f635ec7260bf9aa0699466fa4be0e"},"score":3.5,"checks":[{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#packaging"}},{"name":"Code-Review","score":1,"reason":"Found 5/30 approved changesets -- score normalized to 1","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":10,"reason":"no dangerous workflow patterns detected","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#dangerous-workflow"}},{"name":"Maintained","score":3,"reason":"3 commit(s) and 1 issue activity found in the last 90 days -- score normalized to 3","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#maintained"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":2,"reason":"dependency not pinned by hash detected -- score normalized to 2","details":["Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:7: update your workflow using https://app.stepsecurity.io/secureworkflow/francoismassart/eslint-plugin-tailwindcss/build.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/francoismassart/eslint-plugin-tailwindcss/build.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/francoismassart/eslint-plugin-tailwindcss/build.yml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/build.yml:34: update your workflow using https://app.stepsecurity.io/secureworkflow/francoismassart/eslint-plugin-tailwindcss/build.yml/master?enable=pin","Info: 0 out of 4 GitHub-owned GitHubAction dependencies pinned","Info: 1 out of 1 npmCommand dependencies pinned"],"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#pinned-dependencies"}},{"name":"Token-Permissions","score":0,"reason":"detected GitHub workflow tokens with excessive permissions","details":["Warn: no topLevel permission defined: .github/workflows/build.yml:1","Info: no jobLevel write permissions found"],"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#token-permissions"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#security-policy"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#license"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#fuzzing"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 7 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":5,"reason":"5 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55","Warn: Project is vulnerable to: GHSA-76p7-773f-r4q5"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/c1d103a9bb9f635ec7260bf9aa0699466fa4be0e/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-14T17:34:59.540Z","repository_id":37274930,"created_at":"2025-08-14T17:34:59.540Z","updated_at":"2025-08-14T17:34:59.540Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33569228,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-05-27T02:00:06.184Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["eslint-plugin","rules","tailwind","tailwindcss"],"created_at":"2024-08-03T13:01:01.660Z","updated_at":"2026-05-27T14:11:39.856Z","avatar_url":"https://github.com/francoismassart.png","language":"JavaScript","funding_links":["https://github.com/sponsors/francoismassart","https://thanks.dev/r/gh/francoismassart","https://github.com/sponsors/francoismassart?frequency=recurring","https://github.com/sponsors/francoismassart?frequency=one-time"],"categories":["JavaScript","Plugins"],"sub_categories":["Libraries"],"readme":"# eslint-plugin-tailwindcss\n\n![npm latest version](https://img.shields.io/npm/v/eslint-plugin-tailwindcss?style=for-the-badge) ![license](https://img.shields.io/npm/l/eslint-plugin-tailwindcss?style=for-the-badge) ![downloads](https://img.shields.io/npm/dt/eslint-plugin-tailwindcss?style=for-the-badge)\n\n![eslint-plugin-tailwindcss logo](.github/logo.png)\n\nRules enforcing best practices and consistency using [Tailwind CSS](https://tailwindcss.com/).\n\nWhile you can use the official plugin [`prettier-plugin-tailwindcss`](https://www.npmjs.com/package/prettier-plugin-tailwindcss) for ordering your classnames...\n\n**`eslint-plugin-tailwindcss` offers more than 5 other rules, that you can benefit from on top of `prettier-plugin-tailwindcss`. Sounds good ? Keep reading 👇**\n\n## About Tailwind CSS 4 support\n\nWhile the [development of `eslint-plugin-tailwindcss` for Tailwind CSS v4 is ongoing](https://github.com/francoismassart/eslint-plugin-tailwindcss/tree/alpha/v4), you can use the latest version published on the **beta channel** to get partial support of Tailwind CSS v4.\n\n`npm i eslint-plugin-tailwindcss@beta -D`\n\n\u003e NB: As we will focus the effort on the full rewrite of the plugin, this version is available \"as is\" and you may get errors or false positives like for the rule `no-contradicting-classname `. You can [learn more about these issues on GitHub](https://github.com/hyoban/eslint-plugin-tailwindcss/pull/3).\n\nYou can always disable specific rules if necessary.\n\nThis version has been made possible thanks to the work of [hyoban](https://github.com/hyoban) and his project [`tailwind-api-utils`](https://github.com/hyoban/tailwind-api-utils).\n\n## Supported Rules\n\nLearn more about each supported rules by reading their documentation:\n\n- [`classnames-order`](docs/rules/classnames-order.md): order classnames for consistency and it makes merge conflict a bit easier to resolve\n- [`enforces-negative-arbitrary-values`](docs/rules/enforces-negative-arbitrary-values.md): make sure to use negative arbitrary values classname without the negative classname e.g. `-top-[5px]` should become `top-[-5px]`\n- [`enforces-shorthand`](docs/rules/enforces-shorthand.md): merge multiple classnames into shorthand if possible e.g. `mx-5 my-5` should become `m-5`\n- [`migration-from-tailwind-2`](docs/rules/migration-from-tailwind-2.md) for easy upgrade from Tailwind CSS `v2` to `v3`.\n Warning: at the moment you should [temporary turn off the `no-custom-classname`](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/88) rule if you want to see the warning from `migration-from-tailwind-2`\n- [`no-arbitrary-value`](docs/rules/no-arbitrary-value.md): forbid using arbitrary values in classnames (turned off by default)\n- [`no-custom-classname`](docs/rules/no-custom-classname.md): only allow classnames from Tailwind CSS and the values from the `whitelist` option\n- [`no-contradicting-classname`](docs/rules/no-contradicting-classname.md): e.g. avoid `p-2 p-3`, different Tailwind CSS classnames (`pt-2` \u0026 `pt-3`) but targeting the same property several times for the same variant.\n- [`no-unnecessary-arbitrary-value`](docs/rules/no-unnecessary-arbitrary-value.md): e.g. replacing `m-[1.25rem]` by its configuration based classname `m-5`\n\nUsing ESLint extension for Visual Studio Code, you will get these messages\n![detected-errors](.github/output.png)\n\nYou can can the same information on your favorite command line software as well.\n\n## 🤝 Support `eslint-plugin-tailwindcss`\n\n| 🥰 How you can support us? | 💪 They did it! |\n| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| **Premium Sponsors** \u003cbr /\u003e Support us by becoming a sponsor. \u003cbr /\u003e [Become a recurring sponsor](https://github.com/sponsors/francoismassart?frequency=recurring) | \u003ca href=\"https://www.sent.dm/\" target=\"_blank\"\u003e\u003cimg alt=\"Sent.dm\" width=\"150\" src=\"https://avatars.githubusercontent.com/u/153308555?s=200\u0026v=4\"\u003e\u003c/a\u003e |\n| **Current Sponsors** \u003cbr /\u003e Any amount is appreciated. | \u003ca href=\"https://github.com/codecov\" target=\"_blank\"\u003e\u003cimg class=\"avatar\" src=\"https://avatars.githubusercontent.com/u/8226205?s=150\u0026amp;v=4\" width=\"75\" height=\"75\" style=\"border-radius:100%;\" alt=\"@codecov\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/sourcegraph\" target=\"_blank\"\u003e\u003cimg class=\"avatar\" src=\"https://avatars.githubusercontent.com/u/3979584?s=150\u0026amp;v=4\" width=\"75\" height=\"75\" style=\"border-radius:100%;\" alt=\"@sourcegraph\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/getsentry\" target=\"_blank\"\u003e\u003cimg class=\"avatar\" src=\"https://avatars.githubusercontent.com/u/1396951?s=150\u0026amp;v=4\" width=\"75\" height=\"75\" style=\"border-radius:100%;\" alt=\"@getsentry\"\u003e\u003c/a\u003e |\n| **Past sponsors** \u003cbr /\u003e Even if this is just a one-time thing. \u003cbr /\u003e [Become a backer](https://github.com/sponsors/francoismassart?frequency=one-time) | \u003ca href=\"https://github.com/acewf\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/4835572?s=150\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@acewf\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/hyoban\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/38493346?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@hyoban\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/charkour\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/33156025?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@charkour\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/aniravi24\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/5902976?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@aniravi24\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/amotarao\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/8909592?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@amotarao\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/mongolyy\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/10972787?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@mongolyy\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/t3dotgg\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/6751787?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@t3dotgg\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/fongandrew\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/179327?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@fongandrew\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/nivalis-studio\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/146306714?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@nivalis-studio\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/jonz94\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/16042676?s=100\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@jonz94\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/dailydotdev/daily\" target=\"_blank\"\u003e\u003cimg alt=\"daily.dev\" width=\"50\" height=\"50\" src=\"https://avatars.githubusercontent.com/u/41463883?s=100\u0026amp;v=4\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/kylemh\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/9523719?s=150\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@kylemh\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/theMosaad\" target=\"_blank\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/48773133?s=150\u0026amp;v=4\" width=\"50\" height=\"50\" style=\"border-radius:100%;\" alt=\"@theMosaad\"\u003e\u003c/a\u003e |\n| **Contributors** \u003cbr /\u003e This project can evolve thanks to all the people who contribute. \u003cbr /\u003e You are welcome to [contribute](CONTRIBUTING.md) to this project by reporting issues, feature requests or even opening Pull Requests. | \u003ca href=\"https://github.com/francoismassart/eslint-plugin-tailwindcss/graphs/contributors\"\u003e\u003cimg src=\"https://contrib.rocks/image?repo=francoismassart/eslint-plugin-tailwindcss\u0026width=300\u0026columns=4\" /\u003e\u003c/a\u003e |\n| **Supporters** \u003cbr /\u003e Talk about the plugin on your social networks | [Share the word on Bluesky](https://bsky.app/search?q=eslint-plugin-tailwindcss) or [Reach my profile](https://bsky.app/profile/francoismassart.be) |\n\n\n## Latest changelog\n\n- feat: [partial support for Tailwind CSS v4](https://github.com/hyoban/eslint-plugin-tailwindcss/pull/3) (by [hyoban](https://github.com/hyoban) 🙏)\n- feat: [`enforces-shorthand` rule now support `place-content-*`/`place-items-*`/`place-self-*`](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/376)\n- fix: [`enforces-shorthand` does not work for `h-` \u0026 `w-` when prefixed](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/378) (by [Kamahl19](https://github.com/Kamahl19) 🙏)\n- docs: so long X\n- fix: [custom classnames rule with VueJS objects within list](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/359) (by [Ericlm](https://github.com/Ericlm) 🙏)\n- fix: config loading cache\n- fix: Avoid re-parsing unchanged CSS files\n- fix: [AST expression tests for null expressions](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/345) (by [kesor](https://github.com/kesor) 🙏)\n- fix: [`no-arbitrary-value` rule is too broad](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/318)\n- fix: [support `tag.div` and `tag(Component)`](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/302) (by [nihalgonsalves](https://github.com/nihalgonsalves) 🙏)\n- feat: [**support flat config and ESLint 9**](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/330) (by [kazupon](https://github.com/kazupon) 🙏)\n- feat: new rule [**`no-unnecessary-arbitrary-value`**](docs/rules/no-unnecessary-arbitrary-value.md) 🎉\n- fix: retro compatibility for older Tailwind CSS (before typescript config)\n- fix: [composable touch action classnames](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/293)\n- fix: [`shadow-md` + `shadow-[#color]`can be used together 🤝](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/298)\n- fix: [`tabular-nums` and `slashed-zero` can be used together 🤝](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/316)\n- fix: [`size-*` based `size`, `spacing`, `width` and `height` 🤓](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/315)\n- fix: [there is no `size-screen` 😅](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/307)\n- fix: [edge cases with whitespace in `enforces-shorthand`](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/308)(by [kachkaev](https://github.com/kachkaev) 🙏)\n- fix: [parsing spreads in function call returns](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/285)(by [egorpavlikhin](https://github.com/egorpavlikhin) 🙏)\n- feat: [support for Tailwind CSS 3.4.0](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/297)\n- ci: [add github actions workflow](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/303) (by [nihalgonsalves](https://github.com/nihalgonsalves) 🙏)\n- fix: [bg-center mark as conflicting with bg-[image:xxx]](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/260)\n- feat: [support enforcing truncate shorthand](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/255) (by [bezbac](https://github.com/bezbac) 🙏)\n- fix: [parsing spreads in object expressions](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/251) (by [bezbac](https://github.com/bezbac) 🙏)\n- fix: [do not handle non-ASCII whitespace as separator](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/246) (by [uhyo](https://github.com/uhyo) 🙏)\n- fix: [prefix support for named group/peer syntax](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/244) (by [bezbac](https://github.com/bezbac) 🙏)\n- feat: [support tailwind config in typescript](https://github.com/francoismassart/eslint-plugin-tailwindcss/pull/242) (by [quesabe](https://github.com/quesabe) 🙏)\n **You may have to upgrade your Tailwind CSS version to `3.3.2`**\n\n[View all releases on github](https://github.com/francoismassart/eslint-plugin-tailwindcss/releases)\n\n## Screencasts on our YouTube Channel\n\n| \u003ca href=\"https://www.youtube.com/@eslint-plugin-tailwind-css\"\u003e\u003cimg src=\".github/youtube-eslint-plugin-tailwindcss-round.png\" width=\"80\" height=\"80\" alt=\"YouTube Channel\" /\u003e\u003c/a\u003e | \u003cspan style=\"font-size:18px\"\u003e[ESLint plugin Tailwind CSS](https://www.youtube.com/@eslint-plugin-tailwind-css)\u003c/span\u003e\u003cbr\u003eyoutube.com/@eslint-plugin-tailwindcss |\n| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n\n## Installation\n\n### 1. Install `eslint` and `eslint-plugin-tailwindcss`\n\nYou'll first need to install [ESLint](http://eslint.org):\n\n```\n$ npm i -D eslint eslint-plugin-tailwindcss\n\n```\n\n### 2. Create Configuration file\n\n#### `.eslintrc`\n\nUse .eslintrc.\\* file to configure rules in ESLint \u003c v9. See also: https://eslint.org/docs/latest/use/configure/.\n\n```js\nmodule.exports = {\n root: true,\n extends: [\"plugin:tailwindcss/recommended\"],\n};\n```\n\nIf you would like to know about configuration, Learn more in [ESLint docs](https://eslint.org/docs/latest/use/configure/configuration-files)\n\n#### `eslint.config.js`\n\nUse `eslint.config.js` file to configure rules. This is the default in ESLint v9, but can be used starting from ESLint v8.57.0. See also: https://eslint.org/docs/latest/use/configure/configuration-files-new.\n\n```js\nimport tailwind from \"eslint-plugin-tailwindcss\";\n\nexport default [...tailwind.configs[\"flat/recommended\"]];\n```\n\nIf you would like to know about configuration, Learn more in [ESLint docs](https://eslint.org/docs/latest/use/configure/configuration-files-new)\n\n### 3. Configure ESLint parsers\n\nDepending on the languages you are using in your project you must tell which parser will analyze your source files.\n\nOur recommendations:\n\n#### For `.eslintrc`\n\n- For `js[x]`, `react`, `ts[x]`:\n - Install the parser: `npm i -D @typescript-eslint/parser`\n - Assign it to your files in `eslintrc`:\n ```json5\n overrides: [\n {\n files: ['*.ts', '*.tsx', '*.js'],\n parser: '@typescript-eslint/parser',\n },\n ],\n ```\n- For `vue.js`:\n - Install the parser: `npm i -D vue-eslint-parser`\n - Assign it to your files in `eslintrc`:\n ```json5\n overrides: [\n {\n files: ['*.vue'],\n parser: 'vue-eslint-parser',\n },\n ],\n ```\n- For `HTML` and similar:\n - Install the parser: `npm i -D @angular-eslint/template-parser`\n - Assign it to your files in `eslintrc`:\n ```json5\n overrides: [\n {\n files: ['*.html', '*.blade.php'],\n parser: '@angular-eslint/template-parser',\n },\n ],\n ```\n\n\u003e We removed the default parsers which were added to `v3.8.2` because it created negative impact on dependencies resolution, bundle size increase and possible conflicts with existing configurations.\n\n#### For `eslint.config.js`\n\n- For `js[x]`, `ts[x]`:\n - Install the parser: `npm i -D @eslint/js typescript-eslint`\n - Assign it to your files in `eslint.config.js`:\n\n ```js\n import js from \"@eslint/js\";\n import ts from \"typescript-eslint\";\n import tailwind from \"eslint-plugin-tailwindcss\";\n\n export default [\n // add eslint built-in\n js.configs.recommended,\n // add `typescript-eslint` flat config simply\n // if you would like use more another configuration,\n // see the section: https://typescript-eslint.io/getting-started#details\n ...ts.configs.recommended,\n ...tailwind.configs[\"flat/recommended\"],\n ];\n ```\n\n- For `vue.js`:\n - Install the parser: `npm i -D eslint-plugin-vue`\n - Assign it to your files in `eslint.config.js`:\n\n ```js\n import vue from \"eslint-plugin-vue\";\n import tailwind from \"eslint-plugin-tailwindcss\";\n\n export default [\n // add `eslint-plugin-vue` flat config simply\n // if you would like use more another configuration,\n // see the section: https://eslint.vuejs.org/user-guide/#bundle-configurations-eslint-config-js\n ...vue.configs[\"flat/recommended\"],\n ...tailwind.configs[\"flat/recommended\"],\n ];\n ```\n\n### 4. Add a npm script\n\nIn your `package.json` add one or more script(s) to run eslint targeting your source files:\n\n```json5\n\"scripts\": {\n \"lint\": \"eslint ./src\",\n \"lint:debug\": \"eslint ./src --debug\",\n \"lint:fix\": \"eslint ./src --fix\"\n},\n```\n\n### 5. Run the linting task\n\n`npm run lint` can do the job on demand but you can also get live feedback using [VS Code ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint), **just make sure you restart VS Code** as it can be required for the plugin to work as expected.\n\n## More settings\n\nThe rules accept settings meant to fit your own choices, make sure to read the [documentation of each rule](https://github.com/francoismassart/eslint-plugin-tailwindcss/tree/master/docs/rules).\n\n### Optional shared settings\n\nMost rules share the same settings, instead of duplicating the options all over the place...\n\nYou should define the [shared settings](https://eslint.org/docs/user-guide/configuring#adding-shared-settings) that will be shared across all the plugin rules.\n\nAll these settings already have nice default values that are explained in the documentation.\n\n#### For `.eslintrc`\n\nFYI, here are the `default` values:\n\n```json5\n{\n settings: {\n tailwindcss: {\n // These are the default values but feel free to customize\n callees: [\"classnames\", \"clsx\", \"ctl\"],\n config: \"tailwind.config.js\", // returned from `loadConfig()` utility if not provided\n cssFiles: [\n \"**/*.css\",\n \"!**/node_modules\",\n \"!**/.*\",\n \"!**/dist\",\n \"!**/build\",\n ],\n cssFilesRefreshRate: 5_000,\n removeDuplicates: true,\n skipClassAttribute: false,\n whitelist: [],\n tags: [], // can be set to e.g. ['tw'] for use in tw`bg-blue`\n classRegex: \"^class(Name)?$\", // can be modified to support custom attributes. E.g. \"^tw$\" for `twin.macro`\n },\n },\n}\n```\n\n#### For `eslint.config.js`\n\n```js\nimport tailwind from \"eslint-plugin-tailwindcss\";\n\nexport default [\n ...tailwind.configs[\"flat/recommended\"],\n {\n settings: {\n tailwindcss: {\n // These are the default values but feel free to customize\n callees: [\"classnames\", \"clsx\", \"ctl\"],\n config: \"tailwind.config.js\", // returned from `loadConfig()` utility if not provided\n cssFiles: [\n \"**/*.css\",\n \"!**/node_modules\",\n \"!**/.*\",\n \"!**/dist\",\n \"!**/build\",\n ],\n cssFilesRefreshRate: 5_000,\n removeDuplicates: true,\n skipClassAttribute: false,\n whitelist: [],\n tags: [], // can be set to e.g. ['tw'] for use in tw`bg-blue`\n classRegex: \"^class(Name)?$\", // can be modified to support custom attributes. E.g. \"^tw$\" for `twin.macro`\n },\n },\n },\n];\n```\n\nThe plugin will look for each setting in this order and stops searching as soon as it finds the settings:\n\n1. In the rule option argument (rule level)\n2. In the shared settings (plugin level)\n3. Default value of the requested setting (plugin level)...\n\n## Upcoming Rules\n\n- `validate-modifiers`: I don't know if possible, but I'd like to make sure all the modifiers prefixes of a classname are valid e.g. `yolo:bg-red` should throw an error...\n\n- `no-redundant-variant`: e.g. avoid `mx-5 sm:mx-5`, no need to redefine `mx` in `sm:` variant as it uses the same value (`5`)\n\n- `only-valid-arbitrary-values`:\n - e.g. avoid `top-[42]`, only `0` value can be unitless.\n - e.g. avoid `text-[rgba(10%,20%,30,50%)]`, can't mix `%` and `0-255`.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrancoismassart%2Feslint-plugin-tailwindcss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrancoismassart%2Feslint-plugin-tailwindcss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrancoismassart%2Feslint-plugin-tailwindcss/lists"}