Bootstrap/build tools

من موسوعة حسوب
< Bootstrap
مراجعة 13:24، 13 مارس 2018 بواسطة محمد-أحمد-العيل (نقاش | مساهمات) (أنشأ الصفحة ب'تعلّم كيف تستخدم [https://docs.npmjs.com/misc/scripts سكربتات npm] المُضمَّنة في Bootstrap لإنشاء توليد التوثيق،...')
(فرق) → مراجعة أقدم | المراجعة الحالية (فرق) | مراجعة أحدث ← (فرق)
اذهب إلى التنقل اذهب إلى البحث

تعلّم كيف تستخدم سكربتات npm المُضمَّنة في Bootstrap لإنشاء توليد التوثيق، تجميع الشفرة المصدرية، تشغيل الاختبارات وغير ذلك.

إعداد الأدوات

يعتمد Bootstrap سكربتات npm في نظام البناء Build system الذي يستخدمه. يحوي الملفّ package.json توابع Methods مفيدة للعمل مع إطار العمل، بما في ذلك تجميع الشفرة البرمجية، تشغيل الاختبارات وغيرها.

يتطلّب استخدام نظام البناء في Bootstrap وتشغيل التوثيق محليًّا الحصولَ على نسخة من الملفات المصدرية لإطار العمل Bootstrap وNode. يُفتَرَض بتنفيذ الخطوات التالية أن يجعلك جاهزا للبدء:

  1. نزّل Node.js وثبّته. يستخدم إطار العمل Bootstrap نظام برامج Node.js لإدارة اعتماديّاته Dependencies.
  2. انتقل إلى المجلَّد الرئيسي /bootstrap ونفّذ الأمر npm install لتثبيت اعتماديّات إطار العمل المحدَّدة في الملفّ package.json.
  3. ثبّت Ruby ثم ثبّت Bundler بالأمر gem install bundler؛ وأخيرًا نفّذ الأمر bundle install الذي سيثبّت جميع اعتماديّات Ruby مثل Jekyll والملحقات Plugins. ملحوظة لمستخدمي وندوز: اقرأ هذا الدليل للحصول على Jekyll وتشغيله دون مشكلات.

ستصبح قادرًا بعد إكمال الخطوات السابقة على تشغيل مختلف الأوامر المذكورة هنا من سطر الأوامر.

استخدام سكربتات NPM

يتضمّن الملف package.json الأوامر والمهامّ التاليّة:

المهمّة الوصف
npm run dist ينشئ الأمر npm run dist المجلّد /dist ويضع فيه الملفّات المجمَّعة. تستخدم هذه المهمة Sass و Autoprefixer و UglifyJS.
npm test تشبه npm run dist لكن مع تشغيل الاختبارات محلّيًّا
npm run docs تجمّع CSS و JavaScript وتربطها من أجل التوثيق. يمكن تنفيذ التوثيق محلّيًّا بالأمر npm run docs-serve.

نفّذ الأمر npm run لعرض جميع سكربتات npm.

Autoprefixer

يستخدم إطار العمل Bootstrap الأداة Autoprefixer ضمن عمليّة البناء لإضافة بادئات البائعين Vendor prefixes تلقائيَّا إلى بعضٍ من خاصيّات CSS أثناء الإنشاء. تتيح هذه الطريقة لفريق عمل Bootstrap الاقتصاد في الوقت وكتابة الشفرة عن طريق كتابة الأجزاء الأساسية من CSS مرةً واحدةً والتخلّص من الحاجة لمخاليط Mixins البائعين مثل تلك الموجودة في الإصدار الثالث من إطار العمل Bootstrap.

يحتفظ مطوّرو إطار العمل Bootstrap بقائمة من المتصفّحات المدعومة عن طريق Autoprefixer في ملفّ منفصل ضمن مستودع GitHub. راجع package.json للمزيد من التفاصيل.

التوثيق المحلّي

يتطلّب تشغيلُ توثيق Bootstrap محليَّا استخدامَ Jekyll، وهو مولّد مواقع ثابتة Static site generator مرِن وموثوق يوفّر إمكانيّات مثل أساسيّات التضمين Include، ملفّات تستند على Markdown، قوالب Templates وغيرها. في ما يلي كيفية العمل:

  1. ثبّت Jekyll (مولّد المواقع) واعتماديّات Ruby الأخرى بالأمر bundle install كما هو موضَّح في فقرة إعداد الأدوات أعلاه.
  2. نفّذ الأمر npm run docs-serve في سطر الأوامر انطلاقا من المجلّد الرئيسي /bootstrap.
  3. زر العنوان http://localhost:9001 في المتصفّح.

اقرأ المزيد عن Jekyll بقراءة توثيقه.

إصلاح المشاكل

إن واجهت مشاكل أثناء تثبيت الاعتماديّات فستحتاج لإزالة جميع الإصدارات السابقة من الاعتماديّات (العامّة على النظام والمحليّة في المجلّدات)، ثم نفّذ الأمر npm install.

مصادر