🌐 Taal
prettier-plugin-classnames
Een Prettier-plugin die uitgebreide classnamen afbreekt op basis van de printWidth-optie.
Installatie[^1]
npm install -D prettier prettier-plugin-classnames[^1]: Als uw versie van prettier-plugin-classnames lager is dan 0.4.0, moet u ook @prettier/sync installeren.
Configuratie
JSON-voorbeeld:
{
"plugins": ["prettier-plugin-classnames"]
}JS-voorbeeld (CommonJS-module):
module.exports = {
plugins: ['prettier-plugin-classnames'],
customAttributes: ['myClassProp'],
customFunctions: ['clsx'],
};JS-voorbeeld (ES-module):
export default {
plugins: ['prettier-plugin-classnames'],
endingPosition: 'absolute',
};Markdown/MDX Override
Deze plugin ondersteunt geen Markdown en MDX, maar als deze plugin een taal binnen codeblokken ondersteunt (bijv. Vue), kan onbedoelde opmaak optreden binnen de codeblokken.
Om onbedoelde opmaak te voorkomen, kun je configuratie-overrides gebruiken voor Markdown en MDX.
JSON-voorbeeld:
{
"plugins": ["prettier-plugin-classnames"],
"customFunctions": ["clsx"],
"overrides": [
{
"files": [".md", ".mdx"],
"options": {
"plugins": []
}
}
]
}Opties
Aangepaste Attributen
Lijst van attributen die omliggende klassennamen bevatten.
De attributen class en className worden altijd ondersteund, zelfs als er geen opties zijn opgegeven.
Standaard | CLI Override | API Override
--- | --- | ---
[] | --custom-attributes | customAttributes: ["
Aangepaste Functies
Lijst van functies die omliggende klassennamen bevatten.
De functie classNames wordt altijd ondersteund, zelfs als er geen opties zijn opgegeven.
Standaard | CLI Override | API Override
--- | --- | ---
[] | --custom-functions | customFunctions: ["
Eindpositie
Eerst beschikbaar in v0.5.0.
absolute-with-indent werd toegevoegd in v0.6.0.
absolute-with-indent werd verwijderd in v0.8.0, maar je kunt dezelfde uitvoer krijgen met absolute.
Standaardwaarde veranderd van relative naar absolute in v0.8.0.
Dit is het criterium voor het beëindigen van de klassenaam op elke regel wanneer de originele klassenaam wordt vervangen door een meerregelige klassenaam.
absolutevoorbeeld:
------------------------------------------------------------| printWidth=60
export function Callout({ children }) {
return (
{children}
);
}
``
voorbeeld:
`
------------------------------------------------------------| printWidth=60
export function Callout({ children }) {
return (
{children}
);
}
`
Standaard | CLI Override | API Override
--- | --- | ---
| --ending-position | endingPosition: ""Syntaxis Transformatie
Eerst beschikbaar in v0.7.7.
Als een regelafbreking plaatsvindt in een klassennaam geschreven in niet-expressie syntaxis, wordt deze getransformeerd naar expressie syntaxis. Deze transformatie ondersteunt geen omkeerbare opmaak.
Standaard | CLI Override | API Override
--- | --- | ---
| --syntax-transformation | syntaxTransformation: Printbreedte van klassenamen
Eerst beschikbaar in v0.10.0.
Specificeer de printbreedte van de klassennaam. Als er geen waarde wordt opgegeven, wordt de waarde van
als standaard gebruikt.
Standaard | CLI Override | API Override
--- | --- | ---
undefined | --classnames-print-width | classnamesPrintWidth: Versiecorrelatie met verwante plugins
Vanaf versie
, wanneer er een minor release is aan één kant, is het de bedoeling om die wijziging indien mogelijk ook aan de andere kant te reflecteren.
Compatibiliteit met andere Prettier-plugins
Als meer dan één Prettier-plugin de tekst die u wilt formatteren kan verwerken, zal Prettier alleen de laatste van deze plugins gebruiken.
In dat geval kunt u het als volgt configureren door prettier-plugin-merge toe te voegen, zodat deze plugins opeenvolgend worden toegepast.
JSON-voorbeeld:
Stargazers over time
--- Tranlated By Open Ai Tx | Last indexed: 2026-06-03 ---