ماهو babel؟

Babel هي أداة تحويل الشفرة المصدرية للغة JavaScript من إصدارات حديثة إلى إصدارات قديمة يمكن تشغيلها في المتصفحات القديمة. ولكن عند الحديث عن React ، فإن Babel يستخدم عادة لتحويل الشفرة المصدرية للـ JSX إلى JavaScript. يستخدم React JSX لتسهيل عملية كتابة الشفرة وجعلها أكثر قراءة وفهمًا.

تعتبر Babel أداة مهمة في تطوير تطبيقات React ، حيث يستخدم React JSX بشكل شائع. عند كتابة شفرة React باستخدام JSX ، يمكن لـ Babel تحويلها إلى JavaScript تقليدي يمكن تشغيله في المتصفحات الحديثة والقديمة على حد سواء. بالإضافة إلى ذلك ، يمكن استخدام Babel لتحويل الشفرة المصدرية لـ ES6 و ES7 إلى ES5 الذي يدعمه معظم المتصفحات ، مما يجعل React أكثر توافقًا مع المتصفحات المختلفة.

تحميل babel في مشروعك

يمكن تحميل Babel من خلال npm (Node Package Manager) باستخدام الأمر التالي:

cmd

C:\Users npm install --save-dev @babel/core @babel/cli

يتم تثبيت حزمتي @babel/core و @babel/cli بشكل محلي على جهاز الكمبيوتر الخاص بك ويمكنك استخدامهما في مشروعك. بعد التثبيت ، يمكنك إنشاء ملف .babelrc في مجلد مشروعك وتكوين الإعدادات اللازمة.
على سبيل المثال، يمكنك استخدام الإعدادات التالية في ملف .babelrc لتحويل الشفرة المصدرية التي تستخدم JSX:

.babelrc

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ]
}

يمكنك بعد ذلك استخدام الأمر babel لتحويل الشفرة المصدرية في مجلد المشروع الخاص بك. لتحويل ملف معين ، يمكنك استخدام الأمر التالي:

cmd

C:\Users babel src/index.js -o dist/bundle.js

حيث src/index.js هو مسار ملف الشفرة المصدرية الخاص بك ، و dist/bundle.js هو المسار الذي تريد حفظ الملف المحول إليه. يمكنك التحكم في الإعدادات الأخرى لـ Babel باستخدام ملف .babelrc وتحديد الإعدادات اللازمة لمشروعك.

وهكذا إنتهينا من درسنا أو مقالتنا المتواضعة أتمنى أنك فهمت و وفقك الله أتمنى دعمنا بمشاركة الدرس لكي تعم الفائدة.