prettier-plugin-classnames
Wtyczka Prettier, która zawija długie nazwy klas na podstawie opcji printWidth.

Instalacja[^1]
npm install -D prettier prettier-plugin-classnames[^1]: Jeśli Twoja wersja prettier-plugin-classnames jest niższa niż 0.4.0, będziesz musiał również zainstalować @prettier/sync.
Konfiguracja
Przykład JSON:
{
"plugins": ["prettier-plugin-classnames"]
}Przykład JS (moduł CommonJS):
module.exports = {
plugins: ['prettier-plugin-classnames'],
customAttributes: ['myClassProp'],
customFunctions: ['clsx'],
};Przykład JS (moduł ES):
export default {
plugins: ['prettier-plugin-classnames'],
endingPosition: 'absolute',
};Opcje
Atrybuty niestandardowe
Lista atrybutów, które zamykają nazwy klas.
Atrybuty class i className są zawsze obsługiwane, nawet jeśli nie określono żadnych opcji.
Domyślne | Nadpisanie CLI | Nadpisanie API
--- | --- | ---
[] | --custom-attributes | customAttributes: ["
Funkcje niestandardowe
Lista funkcji, które zamykają nazwy klas.
Funkcja classNames jest zawsze obsługiwana, nawet jeśli nie określono żadnych opcji.
Domyślne | Nadpisanie CLI | Nadpisanie API
--- | --- | ---
[] | --custom-functions | customFunctions: ["
Pozycja końcowa
Po raz pierwszy dostępne w wersji v0.5.0.
absolute-with-indent zostało dodane w wersji v0.6.0.
absolute-with-indent zostało usunięte w wersji v0.8.0, ale ten sam wynik można uzyskać za pomocą absolute.
Wartość domyślna została zmieniona z relative na absolute w wersji v0.8.0.
To jest kryterium kończenia nazwy klasy w każdej linii podczas zamiany oryginalnej nazwy klasy na wieloliniową nazwę klasy.
- przykład
absolute:
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
``- Przykład
relative:
`
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
`
Domyślnie | Nadpisanie CLI | Nadpisanie API
--- | --- | ---
"absolute" | --ending-position | endingPosition: ""Transformacja składni
Dostępne po raz pierwszy w wersji v0.7.7.
Jeśli zawijanie linii występuje w nazwie klasy zapisanej w składni niebędącej wyrażeniem, zostaje ona przekształcona na składnię wyrażenia. Ta transformacja nie obsługuje odwracalnego formatowania.
Domyślnie | Nadpisanie CLI | Nadpisanie API
--- | --- | ---
false | --syntax-transformation | syntaxTransformation: Korelacja wersji z bliźniaczymi wtyczkami
Począwszy od wersji
0.6.0, gdy następuje wydanie wersji pomocniczej po jednej stronie, planuję odzwierciedlić tę zmianę również po drugiej stronie, jeśli to możliwe.
Kompatybilność z innymi wtyczkami Prettier
Jeśli więcej niż jedna wtyczka Prettier może obsłużyć tekst, który chcesz sformatować, Prettier użyje tylko ostatniej z tych wtyczek.
W takim przypadku możesz skonfigurować to w następujący sposób, dodając prettier-plugin-merge, aby zastosować te wtyczki kolejno.
Przykład JSON:
json
{
"plugins": [
"prettier-plugin-tailwindcss",
"prettier-plugin-classnames",
"prettier-plugin-merge"
]
}
``--- Tranlated By Open Ai Tx | Last indexed: 2025-09-09 ---