لا تحب الإعلانات؟ يذهب خالية من الإعلانات اليوم
مُولد إعدادات Prettier
بياناتمطور
إعلان · حذف؟
إعلان · حذف؟
مرشد
مُولد إعدادات Prettier
بناء تكوين صحيح لـ Prettier دون تصفح الوثائق. اختر كل خيار تنسيقي من قائمة، أضف تغييرات حسب اللغة للـ Markdown، HTML، YAML و JSON، ثم أنشئ النتيجة كـ .prettierrc.json, .prettierrc.yaml، ملف مُدمج باللغة ES، ملف مُدمج باللغة CommonJS، أو مفتاح جاهز للإدراج "prettier" مفتاح package.json. نموذج مُطابق يتم إنشاؤه معه لكي يكون مخزنك جاهزًا للتنسيق في أول تغيير. .prettierignore نمط الإخراج
كيفية استخدام
- اختر — JSON للملف الأبسط للإطلاق، YAML للتحرير البشري، ملف JS عند الحاجة إلى منطق شرطي، أو مفتاح package.json عند الرغبة في تقليل عدد الملفات في المخزن. الخيارات الأساسية
- اضبط الخيارات الأساسية: طول السطر، عرض التجميل، علامات الفاصلة، نمط العلامات، علامات خلفية، المسافات داخل الأقواس، الأقواس حول دالة السهم، ونمط نهاية السطر.
- ضبط JSX مُحدّث إذا استخدمت React، و الـ Markdown و HTML مُحدّث لمعالجة تشكيل النصوص والمسافات.
- تمكين أي تعديلات حسب اللغة لتطبيق قواعد مختلفة على أنواع الملفات المحددة — على سبيل المثال، عرض أضخم للـ JSON، أو خاصية واحدة لكل سطر في HTML.
printWidthفي التكوين المُولَّد. ضعه في جذع مشروعك وقم بتشغيل - انقر ينسخ أو تحميل كل خيار رسمي لـ Prettier
npx prettier --write ..
خصائص
- — printWidth، tabWidth، useTabs، semi، singleQuote، quoteProps، jsxSingleQuote، trailingComma، bracketSpacing، bracketSameLine، arrowParens، endOfLine، proseWrap، htmlWhitespaceSensitivity، singleAttributePerLine. الأنماط الممكنة للإخراج
- — JSON، YAML، ESM (.mjs)، CommonJS (.cjs)، وجزء من package.json. مُحدّثات حسب اللغة
- لـ Markdown، HTML، YAML، وJSON مع قيم منطقية يمكنك نسخها مباشرة أو تعديلها. مُولّد تلقائي
- يغطي إخراج البناء، الاعتماديات، ملفات التثبيت، الملفات المُختصرة، وملفات التخزين الشائعة للإطار.
.prettierignoreJSDoc - ملاحظة
@typeعلى الملفات المُدمجة باللغة JS لتمكين التكامل التلقائي والتحقق من الأنواع في المحررات. — كل تغيير يُحدث تغييرًا فوريًا في النتيجة، مما يسمح لك بمقارنة خيارات في ثوانٍ. - العرض المباشر لماذا يحتوي Prettier على عدد قليل جدًا من الخيارات؟
التعليمات
-
هدف تصميم Prettier هو إنهاء النزاعات حول الأسلوب من خلال التصريح. كل خيار تم إضافته تم إضافته بحذر، لأن الاتفاق على القيمة الافتراضية الصحيحة لم يكن ممكنًا. يرفض الفريق إضافة خيارات جديدة لضمان مرونة التكوين وتنبؤات التحقق عبر المشاريع. وهذا هو السبب الذي يجعل شيئًا مثل "المسافات حول الكلمات المفتاحية" غير قابل للتعديل — يتعامل Prettier مع قرارات التنسيق كقرارات مُستهلكة، وليس كتعبير شخصي.
ما الفرق بين خيار trailingComma 'es5' و'all'؟
-
'es5' يضيف علامات خلفية في الأماكن التي سمح بها ECMAScript 5 — مثل المصفوفات والكائنات — لكنه لا يضيفها في معلمات الدوال أو المكالمات. 'all' يضيفها أيضًا في معلمات الدوال والمكالمات، وهو مسموح به في ES2017+ ويُعطي فرقًا أوضح في التغييرات عند إضافة أو إزالة المدخلات. 'all' هو القيمة الافتراضية الحالية لـ Prettier ويعتبر الخيار الموصى به لأي مشروع يستهدف لغة JS الحديثة أو يُحول.
كيف يتعامل Prettier مع ESLint؟
-
Prettier يُعالج التنسيق؛ أما ESLint فيُعالج الدقة. يتقاطعان على القواعد الأسلوبية مثل العلامات والفاصلات، مما يؤدي إلى تعارضات حيث يُبلغ ESLint عن مشكلات يعيد كتابتها Prettier. الحل هو eslint-config-prettier — مُكوّن مُشترك يُوقف كل قاعدة ESLint التي يتحكم بها Prettier. ابدأ بتشغيل Prettier للتنسيق، ثم ابدأ بتشغيل ESLint للكشف عن الأخطاء. لا يُوصى بالعوامل مثل eslint-plugin-prettier التي تُستخدم كقاعدة تحقق لأنها تبطئ ESLint وتُضخّم مصادر الأخطاء.
ما الفرق بين proseWrap في الملفات Markdown؟
-
'preserve' يحتفظ بمسافات السطر المُدخلة. 'always' يُحول النصوص تلقائيًا عند printWidth بحيث يكون المحتوى قابلًا للقراءة في أي محرر، وهو مناسب جدًا للمواقع التي تحتوي على وثائق. 'never' يدمج الأسطر المُحولة إلى سطر واحد، وهو الخيار المناسب للملفات التي ستصنفها أدوات أو تُعرض في بيئة تُظهر الأسطر كأسطر منفصلة. القيمة الافتراضية هي 'preserve' لأن تغييرات أطراف السطر في بعض الأنواع تؤثر على المعنى.
متى يجب استخدام ملف JS بدلاً من JSON؟
-
استخدم JSON عندما يكون التكوين ثابتًا ويُشارك بين الفرق — فهو الأبسط وأكثر مرونة. استخدم ملف JS عندما تحتاج إلى استيراد قواعد مشاركة من مُستودع، أو تبديل الخيارات بناءً على متغير بيئة، أو استيراد تغييرات من قائمة مُحددة في الكود، أو استخدام أنواع TypeScript من خلال استيراد JSDoc @type. يُعد ملف JS أبطأ في التحميل لأن Prettier يجب أن يُنفذه، لكن التكلفة غير مرئية عند سرعة حفظ المحرر.
مُولد تكوين Prettier 1
هل تريد حذف الإعلانات؟
تخلص من الإعلانات اليوم
تثبيت ملحقاتنا
أضف أدوات IO إلى متصفحك المفضل للوصول الفوري والبحث بشكل أسرع
恵 وصلت لوحة النتائج!
لوحة النتائج هي طريقة ممتعة لتتبع ألعابك، يتم تخزين جميع البيانات في متصفحك. المزيد من الميزات قريبا!
إعلان · حذف؟
أدوات يجب تجربتها
عرض الكلإعلان · حذف؟
شارك
ساعدنا على الاستمرار في تقديم أدوات مجانية قيمة
إعلان · حذف؟