🌐 Langue
prettier-plugin-classnames
Un plugin Prettier qui découpe les noms de classes trop longs selon l’option printWidth.
Installation[^1]
npm install -D prettier prettier-plugin-classnames[^1] : Si votre version de prettier-plugin-classnames est inférieure à 0.4.0, vous devrez également installer @prettier/sync.
Configuration
Exemple JSON :
{
"plugins": ["prettier-plugin-classnames"]
}Exemple JS (module CommonJS) :
module.exports = {
plugins: ['prettier-plugin-classnames'],
customAttributes: ['myClassProp'],
customFunctions: ['clsx'],
};Exemple JS (module ES) :
export default {
plugins: ['prettier-plugin-classnames'],
endingPosition: 'absolute',
};Options
Attributs personnalisés
Liste des attributs qui englobent les noms de classe.
Les attributs class et className sont toujours pris en charge, même si aucune option n'est spécifiée.
Par défaut | Remplacement CLI | Remplacement API
--- | --- | ---
[] | --custom-attributes | customAttributes: ["
Fonctions personnalisées
Liste des fonctions qui englobent les noms de classe.
La fonction classNames est toujours prise en charge, même si aucune option n'est spécifiée.
Par défaut | Remplacement CLI | Remplacement API
--- | --- | ---
[] | --custom-functions | customFunctions: ["
Position de fin
Disponible pour la première fois en v0.5.0.
absolute-with-indent a été ajouté en v0.6.0.
absolute-with-indent a été supprimé en v0.8.0, mais vous pouvez obtenir la même sortie avec absolute.
La valeur par défaut est passée de relative à absolute en v0.8.0.
Ceci est le critère pour terminer le nom de classe sur chaque ligne lors du remplacement du nom de classe original par un nom de classe multi-lignes.
- Exemple
absolute:
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
``- Exemple
:
`
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
`
Par défaut | Surcharge CLI | Surcharge API
--- | --- | ---
| --ending-position | endingPosition: ""Transformation de syntaxe
Disponible pour la première fois en v0.7.7.
Si un retour à la ligne se produit dans un nom de classe écrit en syntaxe non-expression, il est transformé en syntaxe expression. Cette transformation ne supporte pas la mise en forme réversible.
Par défaut | Surcharge CLI | Surcharge API
--- | --- | ---
| --syntax-transformation | syntaxTransformation: Corrélation de version avec les plugins associés
À partir de
, lorsqu’une version mineure est publiée d’un côté, je prévois de refléter ce changement de l’autre côté si possible.
Compatibilité avec d’autres plugins Prettier
Si plusieurs plugins Prettier peuvent gérer le texte que vous souhaitez formater, Prettier n’utilisera que le dernier de ces plugins.
Dans ce cas, vous pouvez configurer comme suit en ajoutant prettier-plugin-merge pour appliquer ces plugins séquentiellement.
Exemple JSON :
--- Tranlated By Open Ai Tx | Last indexed: 2025-09-09 ---