{"library":"prettier-plugin-tailwind-styled-components","title":"prettier-plugin-tailwind-styled-components","description":"Prettier plugin for sorting Tailwind CSS classes in tailwind-styled-components template literals. Current stable version 2.0.2 (Feb 2026), requires Node >=20.19 and Prettier ^3.0. Built on top of the official prettier-plugin-tailwindcss, it extends class sorting to tagged template literals used by tailwind-styled-components. Supports Tailwind CSS v3 and v4, custom tailwindConfig/tailwindStylesheet paths, duplicate class preservation, and custom function names. ESM-only; no CJS support. Release cadence: irregular, with breaking changes in v2.0 (made tailwind-styled-components optional peer dep).","language":"javascript","status":"active","last_verified":"Sat Apr 25","install":{"commands":["npm install prettier-plugin-tailwind-styled-components"],"cli":null},"imports":["// Plugin is loaded via .prettierrc plugins array; no JS import needed","{\n  \"plugins\": [\n    \"prettier-plugin-tailwindcss\",\n    \"prettier-plugin-tailwind-styled-components\"\n  ]\n}","{\n  \"tailwindFunctions\": [\"tw\"]\n}"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"// 1. Install dependencies\n// npm install -D prettier prettier-plugin-tailwindcss prettier-plugin-tailwind-styled-components\n\n// 2. Create .prettierrc\n{\n  \"plugins\": [\n    \"prettier-plugin-tailwindcss\",\n    \"prettier-plugin-tailwind-styled-components\"\n  ],\n  \"tailwindFunctions\": [\"tw\"]\n}\n\n// 3. Write a component (example: Button.tsx)\nimport tw from \"tailwind-styled-components\";\n\nexport const Button = tw.button`\n  px-4 py-2\n  bg-blue-500\n  text-white\n  rounded\n  hover:bg-blue-600\n  focus:outline-none\n`;\n\n// 4. Run Prettier\n// npx prettier --write Button.tsx\n// Output: classes sorted according to Tailwind's recommended order","lang":"typescript","description":"Install the plugin, configure .prettierrc with both plugins (order matters), and format a tailwind-styled-components tagged template literal.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}