"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > تصميم وحدة التحكم في JavaScript ببضعة كيلو بايت

تصميم وحدة التحكم في JavaScript ببضعة كيلو بايت

تم النشر بتاريخ 2024-08-01
تصفح:108

Console Styling in JavaScript with a few kilobytes

لا أعرف شيئًا عنك ، لكني أحب الاحتفاظ بسجلات وحدة التحكم الخاصة بي في مشاريع JavaScript الخاصة بي بشكل جيد. وبما أن جميع الأجهزة الطرفية لا تدعم الرموز التعبيرية، ما هي أفضل طريقة لدي من تلوين مخرجات وحدة التحكم؟

حسنًا، يمكنك القيام بذلك عن طريق البحث عبر Google عن رمز الهروب ANSI لكل نمط وحدة تحكم تريده. أو ربما تحفظ بعضها من صفحة مثل W3Docs. لكني أحب أن أجعل سجلاتي تبدو جيدة، وأنا بالتأكيد لست شخصًا يمكنه حفظ الكثير من الأشياء، وأحب أن يكون لدي طريقة واحدة تعمل

في كل مكان.

حسنًا، عادةً ما أستخدم السجلات الملونة فقط لـ JS، لذلك لا حاجة لشيء يعمل حرفيًا في كل مكان. ولكن على الأقل شيء يعمل أينما كان هناك JavaScript.

لذلك قررت أن أكتب البرنامج النصي الخاص بي الذي يحتوي على كل كود الهروب المحتمل لـ ANSI الذي قد أحتاج إليه، في شكل وظائف. ولكن بعد ذلك أدركت أنه سيكون من المزعج نسخ نفس النص مرارًا وتكرارًا في جميع مشاريعي. لذا، كشخص لم يعمل مطلقًا مع أمر npm إلى جانب npm i وinit، قررت أن أتعلم المزيد وأنشئ حزمة NPM خاصة يمكنني تثبيتها في مشاريعي (أو استنساخ مستودع GitHub الخاص بها للمشاريع غير التابعة لـ NodeJS).

لم أرغب في التعامل مع مصادقة NPM في كل مرة أقوم فيها بتثبيت الحزمة، لذلك قمت بنشرها للعامة.

وهذا ما نحن هنا من أجله اليوم: javascript-console-styling عبارة عن حزمة قمت بإعدادها لتسهيل هذه العملية عليّ.

في الواقع، تم إنشاء حزم مماثلة لتلك الخاصة بي من قبل (وهي حقيقة لم أدركها إلا بعد صنعها). لكنني لاحظت أن الحل الخاص بي لا يزال أفضل بالنسبة لي أو لأي شخص مثلي:

  • تشغل الحزمة الخاصة بي 14 كيلو بايت فقط من المساحة، وفقًا لـ npm. بينما الحزم الأخرى المشابهة أخذت ما يصل إلى

    50 مرة نفس المقدار (أكثر من 500 كيلو بايت). على الرغم من أن حجمهما أقل من ميغابايت، إلا أنه لا يزال من الأفضل أن يكون لديك حزمة أصغر لأنه يمكنك إدارة جميع ملفاتها بسهولة (أو حتى تفرعها وتعديلها بسهولة إذا كنت ترغب في ذلك)

  • يمكن أن تتداخل الحزمة الخاصة بي مع أنماط وزخارف مختلفة نظرًا لأنها وظائف... وحتى إذا كان لديك سلسلة كاملة النمط تحتوي على سلسلة فرعية بنمط مختلف، فيمكنك فقط ربط السلسلة الفرعية (بما في ذلك السلسلة الفرعية الموجودة بالداخل) ستوقف السلسلة الأصلية تطبيق أي أنماط بعد ذلك بسبب إعادة التعيين التي تقوم بها كل وظيفة تصميم)

  • تحتوي الحزمة الخاصة بي على أدوات اختبار سهلة أظهرت جميع مجموعات الألوان والديكور الممكنة حتى يتمكن المستخدمون من التحقق من مخرجاتها في أجهزتهم الطرفية (لا يتم تضمين وظائف الاختبار في الحزمة الافتراضية، ولكنها متوفرة على صفحة NPM وعلى جيثب)

بشكل عام، أفضل استخدام الكود الخاص بي. ولكن جزءًا من امتلاك حزمة عامة هو التأكد من أن الأشخاص يعرفون كيف يمكن أن يساعدوهم، حتى يتمكنوا من الاختيار بأنفسهم إذا كانوا في حاجة إليها.

لا أعتقد أن هذه ستكون آخر حزمة NPM أقوم بإنشائها، لكنها كانت طريقة جيدة لتحفيزي بشأن موضوع NPM بأكمله!

تأكد من التحقق من الحزمة، وقرصنة سعيدة!

بيان الافراج هذه المقالة مستنسخة على: https://dev.to/proman4713/console-styling-in-javascript-with-a-few-kilobytes-2gjn?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] للحذف هو - هي
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3