Angular Academy · درس

النشر إلى npm

حدّد إصدار مكتبتك وانشرها

النشر إلى npm درس مجاني في Angular Academy على CoddyKit. هذا هو الدرس 4 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Angular Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Angular Academy 4 دروس في المجموع.

مشاركة مكتبتك مع العالم

بعد بناء المكتبة وفق Angular Package Format، تُنشر في سجل، عادةً npm، حتى يتمكن أي مشروع من تثبيتها باستخدام npm install. يغطي هذا الدرس إدارة الإصدارات وسير عمل النشر.

انشر مخرجات dist لا الشيفرة المصدرية

انشر الحزمة المبنية الموجودة في dist/<lib>، والتي تحتوي على ملف package.json المُنشأ والحزم المجمّعة، وليس مشروع الشيفرة المصدرية الخام. فخطوة البناء هي التي تجعلها قابلة للاستهلاك.

ng build ui-kit --configuration production
cd dist/ui-kit

الإصدار الدلالي

تستخدم حزم npm نظام semver: MAJOR.MINOR.PATCH. ارفع PATCH للإصلاحات، وMINOR للميزات المتوافقة مع الإصدارات السابقة، وMAJOR للتغييرات الكاسرة. يعتمد المستهلكون على ذلك للترقية بأمان.

0.0.1 -> 0.1.0   # new feature, no breaks (minor)
0.1.0 -> 0.1.1   # bug fix (patch)
0.1.1 -> 1.0.0   # breaking change (major)

تحديد الإصدار

يأتي الإصدار من ملف package.json الخاص بالمكتبة. حدّثه قبل البناء، أو استخدم npm version لرفع الإصدار بشكل متسق.

# inside projects/ui-kit (or use the field directly)
npm version minor   # bumps and tags the version

تسجيل الدخول إلى npm

صادق لدى السجل قبل النشر. يخزّن npm login رمزًا مميزًا حتى يكون أمر النشر مخوّلًا.

npm login
# enter username, password / token, email

النشر

من مجلد الحزمة المبنية، شغّل npm publish. يرفع npm الحزمة ويجعل تثبيتها ممكنًا باستخدام اسمها وإصدارها.

cd dist/ui-kit
npm publish

الحزم ذات النطاق

تستخدم حزم المؤسسات نطاقًا مثل @myorg/ui-kit. تكون الحزم ذات النطاق خاصةً افتراضيًا على npm؛ مرّر --access public لنشرها للعامة.

npm publish --access public

تثبيت المكتبة المنشورة

يضيفها المستهلكون بعد ذلك مثل أي تبعية، ويستوردونها من واجهتها البرمجية العامة. يعثر Angular على حزمة FESM والأنواع عبر ملف package.json المُنشأ.

npm install ui-kit
// then:
import { ButtonComponent } from 'ui-kit';

إصدارات ما قبل الإطلاق والوسوم

انشر الإصدارات غير المستقرة باستخدام وسم توزيع مثل next حتى لا تصبح وسم latest الافتراضي. ويختار المستهلكون استخدامها صراحةً.

npm publish --tag next
npm install ui-kit@next

السجلات الخاصة

بالنسبة إلى المكتبات الداخلية فقط، انشرها في سجل خاص (حزم npm الخاصة أو GitHub Packages أو Verdaccio) من خلال إعداد .npmrc. وسير عمل النشر هو نفسه، ولا يختلف إلا عنوان السجل وبيانات المصادقة.

الأتمتة في CI

تنشر الفرق الناضجة من CI عند إصدار يحمل وسمًا: تبني pipeline المكتبة، وتشغّل الاختبارات، ثم تشغّل npm publish باستخدام رمز مميز مخزّن. يتجنب ذلك الأخطاء اليدوية ويحافظ على إمكانية تتبع الإصدارات إلى عمليات الإيداع.

تحقق سريع

ماذا تنشر إلى npm؟

مراجعة

انشر مخرجات dist/<lib> المبنية، مع إدارة إصدارها باستخدام semver. ارفع الإصدار، ثم نفّذ npm login وبعده npm publish (أضف --access public للحزم ذات النطاق، و--tag next لإصدارات ما قبل الإطلاق). ينفّذ المستهلكون npm install ويستوردون من واجهة البرمجة العامة. وأتمت النشر في CI لتحقيق الموثوقية.

الأسئلة الشائعة

هل درس «النشر إلى npm» مجاني؟

نعم — نص درس «النشر إلى npm» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Angular Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Angular Academy 4 دروس في المجموع.

ماذا ستتعلم في «النشر إلى npm»؟

حدّد إصدار مكتبتك وانشرها تتمرن على Angular Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Angular Academy؟

لا تُشترط خبرة سابقة. Angular Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 4 من أصل 4.

كم من الوقت يستغرق درس «النشر إلى npm»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Angular Academy هذا؟

نعم. كل درس في Angular Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

← العودة إلى Angular Academy