You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+22Lines changed: 22 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -91,6 +91,28 @@ function MyButton({ children }) {
91
91
}
92
92
```
93
93
94
+
#### Matching attributes with a prefix or suffix
95
+
96
+
```json5
97
+
// .prettierrc
98
+
{
99
+
"tailwindAttributesStartsWith": ["data"],
100
+
"tailwindAttributesEndsWith": ["ClassName"]
101
+
}
102
+
```
103
+
104
+
With this configuration, attributes like `data-active-classes` and `buttonClassName` will be sorted:
105
+
106
+
```jsx
107
+
functionMyButton({ children }) {
108
+
return (
109
+
<button buttonClassName="bg-blue-600 text-white">
110
+
{children}
111
+
</button>
112
+
);
113
+
}
114
+
```
115
+
94
116
## Sorting classes in function calls
95
117
96
118
In addition to sorting classes in attributes, you can also sort classes in strings provided to function calls. This is useful when working with libraries like [clsx](https://github.com/lukeed/clsx) or [cva](https://cva.style/).
0 commit comments