Entry File ملف الدخول
آخر تحديث: 2026-11-03
Entry File ملف الدخول
ملف الدخول — وهو عادةً src/main.jsx — هو نقطة انطلاق تطبيق React: يركّب المكوّن الجذر على عقدة DOM المحدّدة في index.html. نادراً ما تغيّره أثناء التطوير اليومي، لكن فهم تدفق التركيب يساعدك على تصحيح مشكلات الإقلاع مثل الشاشة البيضاء. وهو أيضاً الملف الذي يحدّد أي خط بناء وأي إضافات تنطبق على التطبيق كله.
| المجموعة | المفاهيم الأساسية |
|---|---|
| النوع | أدوات |
| منذ الإصدار | React 18 (واجهة createRoot) |
ℹ️ ملاحظة يحوّل المحرّر JSX إلى JavaScript ويعرض الواجهة الحقيقية داخل بيئة معزولة؛ تُركَّب المكوّنات تلقائياً دون استدعاء render يدوي.
📝 الصيغة
// src/main.jsx — التطبيق يبدأ من هنا
import { createRoot } from 'react-dom/client'
import App from './App'
createRoot(document.getElementById('root')).render(<App />)
// ↑ يجد عقدة #root في index.html ↑ يركّب المكوّن الجذرالقيمة المرجعة：لا قيمة معادة — هذا ملف تشغيل المشروع.
▶ مثال
المثال يعمل مباشرة: يُعرض تلقائياً عند التوسيع وتظهر التعديلات فوراً.
الناتج：
بطاقة بعنوان «Application startup flow» تعرض في البداية الخطوة ① فقط؛ كل نقرة على الزر تكشف سطراً إضافياً، وبعد الخطوة الرابعة تعيد النقرة التالية-programme من البداية، محاكياً السلسلة الكاملة التي يركّب بها ملف الدخول التطبيق.💡 النقاط الأساسية
⚠️ تحذير عند ظهور شاشة بيضاء تحقّق من أمرين أولاً: هل #root موجود في index.html، وهل يُضمَّن main.jsx صحيحاً في index.html.
ℹ️ ملاحظة منذ React 18 استُخدمت واجهة createRoot؛ أما استدعاء ReactDOM.render القديم فينتمي إلى عصر React 17.
💡 نصيحة يجب تركيب المكوّن الجذر مرة واحدة فقط في الصفحة؛ وحين تتعايش عدة تطبيقات React أعطِ كل واحدٍ عقدة تركيب خاصة به.
🏷️ المزيد من المفاهيم الأساسية
💡 حالات ذات صلة
المزيد من الحالات قريباً.
📚 دروس ذات صلة
❓ الأسئلة الشائعة
س أي ملف هو ملف دخول React؟
ج في مشروع Vite هو src/main.jsx افتراضياً (main.tsx لقالب TypeScript). يحمّله index.html عبر وسم <script> وهو مسؤول عن تركيب المكوّن الجذر.
س ماذا تفعل createRoot؟
ج تنشئ جذر React على عقدة DOM المعطاة وتعيد نسخة جذر فيها دالة render؛ وكل خصائص التزام React 18 تُفعَّل عبر نقطة دخول createRoot هذه.
س ما علاقة الشاشة البيضاء بملف الدخول؟
ج العلاقة وثيقة: معرّف #root غير مطابق، أو سكربت الدخول غير محمّل، أو خطأ في المكوّن الجذر — كلها تُنتج شاشة بيضاء. اقرأ خطأ الطرفية أولاً ثم راجع ملف الدخول.
