🌐 اللغة
prettier-plugin-classnames
إضافة لـ Prettier تقوم بتقسيم أسماء الصفوف الطويلة بناءً على خيار printWidth.
التثبيت[^1]
npm install -D prettier prettier-plugin-classnames[^1]: إذا كان إصدارك من prettier-plugin-classnames أقل من 0.4.0، ستحتاج أيضًا إلى تثبيت @prettier/sync.
التهيئة
مثال JSON:
{
"plugins": ["prettier-plugin-classnames"]
}مثال JS (وحدة CommonJS):
module.exports = {
plugins: ['prettier-plugin-classnames'],
customAttributes: ['myClassProp'],
customFunctions: ['clsx'],
};مثال JS (وحدة ES):
export default {
plugins: ['prettier-plugin-classnames'],
endingPosition: 'absolute',
};تجاوز Markdown/MDX
لا يدعم هذا البرنامج الإضافي Markdown و MDX، ولكن إذا كان هذا البرنامج الإضافي يدعم لغة داخل كتل الشيفرة (مثل Vue)، فقد يحدث تنسيق غير مقصود داخل كتل الشيفرة.
لمنع التنسيق غير المقصود، يمكنك استخدام تجاوزات التكوين لـ Markdown و MDX.
مثال JSON:
{
"plugins": ["prettier-plugin-classnames"],
"customFunctions": ["clsx"],
"overrides": [
{
"files": [".md", ".mdx"],
"options": {
"plugins": []
}
}
]
}الخيارات
السمات المخصصة
قائمة السمات التي تحتوي على أسماء الفئات المغلقة.
سمتا class و className مدعومتان دائمًا، حتى لو لم يتم تحديد أي خيارات.
القيمة الافتراضية | تجاوز CLI | تجاوز API
--- | --- | ---
[] | --custom-attributes | customAttributes: ["
الدوال المخصصة
قائمة الدوال التي تحتوي على أسماء الفئات المغلقة.
دالة classNames مدعومة دائمًا، حتى لو لم يتم تحديد أي خيارات.
القيمة الافتراضية | تجاوز CLI | تجاوز API
--- | --- | ---
[] | --custom-functions | customFunctions: ["
وضع النهاية
ظهرت لأول مرة في الإصدار v0.5.0.
تمت إضافة absolute-with-indent في v0.6.0.
تمت إزالة absolute-with-indent في v0.8.0، لكن يمكنك الحصول على نفس الناتج باستخدام absolute.
تم تغيير القيمة الافتراضية من relative إلى absolute في v0.8.0.
هذا هو المعيار لإنهاء اسم الفئة في كل سطر عند استبدال اسم الفئة الأصلي باسم فئة متعدد الأسطر.
- مثال على
absolute:
------------------------------------------------------------| printWidth=60
export function Callout({ children }) {
return (
{children}
);
}
``- مثال على
:
`
------------------------------------------------------------| printWidth=60
export function Callout({ children }) {
return (
{children}
);
}
`
الافتراضي | تجاوز CLI | تجاوز API
--- | --- | ---
| --ending-position | endingPosition: ""تحويل الصياغة النحوية
متوفر لأول مرة في الإصدار v0.7.7.
إذا حدث التفاف للسطر في اسم صنف مكتوب بصياغة غير تعبيرية، يتم تحويله إلى صياغة تعبيرية. هذا التحويل لا يدعم التنسيق العكسي.
الافتراضي | تجاوز CLI | تجاوز API
--- | --- | ---
| --syntax-transformation | syntaxTransformation: عرض الطباعة لأسماء الأصناف
متوفر لأول مرة في الإصدار v0.10.0.
حدد عرض الطباعة لاسم الصنف. إذا لم يتم توفير قيمة، سيتم استخدام قيمة
كافتراضية.
الافتراضي | تجاوز CLI | تجاوز API
--- | --- | ---
undefined | --classnames-print-width | classnamesPrintWidth: الارتباط بين الإصدارات والإضافات الشقيقة
بدءًا من الإصدار
، عند وجود إصدار فرعي في أحد الجانبين، أخطط لعكس هذا التغيير على الجانب الآخر أيضًا إذا أمكن.
التوافق مع إضافات Prettier الأخرى
إذا كان بإمكان أكثر من إضافة Prettier التعامل مع النص الذي تريد تنسيقه، فسيستخدم Prettier فقط آخر إضافة من هذه الإضافات.
في هذه الحالة، يمكنك تهيئتها كما يلي عن طريق إضافة prettier-plugin-merge لتطبيق هذه الإضافات بالتسلسل.
مثال JSON:
Stargazers over time
--- Tranlated By Open Ai Tx | Last indexed: 2026-06-03 ---