{"library":"prettier-plugin-tailwindcss-canonical-classes","title":"prettier-plugin-tailwindcss-canonical-classes","description":"Prettier plugin (v0.1.4) that automatically converts non-canonical Tailwind CSS v4 classes (e.g., mt-[16px] → mt-4) to their design-system-native equivalents. Requires Prettier ^3.0.0 and Tailwind CSS ^4.0.0. Ships TypeScript types. Differentiates from official sorting plugin by focusing on canonicalization rather than sorting; both can be chained. Active development with frequent releases. Node.js >= 18 required.","language":"javascript","status":"active","last_verified":"Sat Apr 25","install":{"commands":["npm install prettier-plugin-tailwindcss-canonical-classes"],"cli":null},"imports":["plugins: ['prettier-plugin-tailwindcss-canonical-classes']","import plugin from 'prettier-plugin-tailwindcss-canonical-classes'","import type { PluginOptions } from 'prettier-plugin-tailwindcss-canonical-classes'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"// Install: npm install -D prettier-plugin-tailwindcss-canonical-classes prettier tailwindcss\n// .prettierrc\n{\n  \"plugins\": [\"prettier-plugin-tailwindcss-canonical-classes\"],\n  \"tailwindcssCanonicalStylesheet\": \"./src/globals.css\",\n  \"tailwindcssCanonicalRootFontSize\": 16\n}\n\n// Input: <div class=\"mt-[16px] text-[red] p-[1rem]\">Hello</div>\n// Output after Prettier: <div class=\"mt-4 text-red p-4\">Hello</div>","lang":"typescript","description":"Installs plugin, configures it in .prettierrc with stylesheet path and root font size, then demonstrates canonicalization of arbitrary value classes to design tokens.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}