التثبيت

استنادًا إلى React / Next.js (موجه التطبيق)

يمكن استخدام هذه المكتبة في بيئات React النقية وNext.js App Router، وتدعم نقطة دخول Next.js من 14.2 إلى أقل من 17.

تم تضمين rxjs (>= 7) و fast-deep-equal (3.1.3) كاعتماديات وقت التشغيل للمكتبة، لذا عادةً لا تحتاج إلى تثبيتها بشكل منفصل.

تم تضمين تعريفات النوع (.d.ts) في الحزمة، مما يجعلها قابلة للاستخدام مباشرة في TypeScript.

يتم استيراد الأنماط بناءً على وحدات CSS في المكونات، وتعمل بدون استيراد CSS عالمي منفصل.

المتطلبات

React >= 18، React DOM >= 18اعتماديات النظير
Next.js >= 14.2 < 17 هو اعتماد اختياري مطلوب عند استخدام @byeolnaerim/flex-layout/next.

تثبيت

bash

في Next.js App Router، حدد URL فقط لعرض page.tsx على الخادم واسحبه إلى pane جديد في FlexLayoutSplitScreen.

لإسقاط page.tsx في FlexLayoutSplitScreen باستخدام URL فقط في Next.js، استخدم @byeolnaerim/flex-layout/next و /next/generator. لا تحتاج هذه الإعدادات لاستخدام FlexLayout العادي.

tsx

ملاحظة Next.js

@byeolnaerim/flex-layoutالمكونات الرئيسية لها تم الإعلان عنها داخليًا "استخدم العميل"لذا، يمكن استيرادها مباشرة بعد استيراد مكون الخادم (مثل: app/layout.tsx) وستعمل على الفور.

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

الخيار 1. إنشاء ملف تغليف للعميل للتصدير

FlexLayoutClient.tsx

tsx

وفي مكون الخادم:

tsx

الخيار 2. الاستيراد الديناميكي

tsx