الفرق بين المراجعتين لصفحة: «ReactNative/native modules setup»

من موسوعة حسوب
أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE: إعداد الوحدات الأصيلة في React Native}}</noinclude> عادةً ما تُوزَّع الوحدات الأصيلة كحزم...'
 
طلا ملخص تعديل
 
(مراجعتان متوسطتان بواسطة مستخدمين اثنين آخرين غير معروضتين)
سطر 5: سطر 5:


<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">
$ npm install -g react-native-create-library
npx create-react-native-library react-native-awesome-module
$ react-native-create-library MyLibrary
</syntaxhighlight>
</syntaxhighlight>


حيث ‎‎<code>MyLibrary</code>‎‎ هو الاسم الذي تريده للوحدة الجديدة. بعد تنفيذ ما سبق، انتقل إلى مجلد <code>MyLibrary</code>‎‎ وثبّت حزمة npm لتكون متاحة محليًا على حاسوبك بالأمر التالي:
حيث ‎‎<code>react-native-awesome-module</code>‎‎ هو الاسم الذي تريده للوحدة الجديدة. بعد تنفيذ ما سبق، انتقل إلى مجلد <code>react-native-awesome-module</code> وشغل مشروع المثال بواسطة :
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">
$ npm install
yarn
</syntaxhighlight>
</syntaxhighlight>


بعد الانتهاء من هذه الخطوة، يمكنك الانتقال إلى مجلد  تطبيق react الخاص بك (الذي أنشأته بالأمر ‎‎<code>react-native init MyApp</code>‎‎ أو ما شابهه)
بعد الانتهاء من هذه الخطوة، يمكنك بدء تطبيق المثال بتنفيذ إحدى التعليمات:<syntaxhighlight lang="javascript">
# Android app
yarn example android
# iOS app
yarn example ios
</syntaxhighlight>بعد تنفيذ كل ما سبق، يمكنك [[ReactNative/native modules ios|تصفّح وحدات iOS]] الأصيلة أو [[ReactNative/native modules android|وحدات Android]] الأصيلة لإضافة شيفراتك البرمجيّة.


* أضف الوحدة المنشأة حديثا كاعتماديّةٍ في ملفّ package.json الخاص بك.
للحصول على إعداد أقل تصلبًا ألق نظرة على أداة الطرف الثالث [https://github.com/brodybits/create-react-native-module create-react-native-module]
* نفّذ الأمر npm install لجلبها من مستودع npm المحلي.
 
بعد تنفيذ كل ما سبق، يمكنك تصفّح وحدات iOS الأصيلة أو وحدات Android الأصيلة لإضافة شيفراتك البرمجيّة. تأكد من قراءة ملفّ README.md في مجلّد MyLibrary الخاص بك للحصول على إرشادات خاصّة بالمنصّة حول كيفية تضمين المشروع.


== مصادر ==
== مصادر ==
* [https://facebook.github.io/react-native/docs/native-modules-setup صفحة Native Modules Setup في توثيق React Native الرسمي.]
* [https://facebook.github.io/react-native/docs/native-modules-setup صفحة Native Modules Setup في توثيق React Native الرسمي.]
[[تصنيف:ReactNative]]
[[تصنيف:ReactNative]]
[[تصنيف:React Native Docs]]

المراجعة الحالية بتاريخ 13:50، 9 أكتوبر 2021

عادةً ما تُوزَّع الوحدات الأصيلة كحزم npm، باستثناء أنّها تحتوي على شيفراتٍ أصيلة حسب المنصّة إضافة إلى شيفرة JavaScript المعتادة. انظر هذه الصفحة للاستزادة حول حزم npm.

لإعداد بنية المشروع الأساسية لوحدةٍ أصيلة، سنستخدم مكتبة react-native-create-library. يمكنك التعمق في كيفية عمل هذه المكتبة إن أردت، لكنّنا سنحتاج هنا فقط إلى ما يلي:

npx create-react-native-library react-native-awesome-module

حيث ‎‎react-native-awesome-module‎‎ هو الاسم الذي تريده للوحدة الجديدة. بعد تنفيذ ما سبق، انتقل إلى مجلد react-native-awesome-module وشغل مشروع المثال بواسطة :

yarn

بعد الانتهاء من هذه الخطوة، يمكنك بدء تطبيق المثال بتنفيذ إحدى التعليمات:

# Android app
yarn example android
# iOS app
yarn example ios

بعد تنفيذ كل ما سبق، يمكنك تصفّح وحدات iOS الأصيلة أو وحدات Android الأصيلة لإضافة شيفراتك البرمجيّة.

للحصول على إعداد أقل تصلبًا ألق نظرة على أداة الطرف الثالث create-react-native-module

مصادر