إنشاء مشروع باستخدام npm create svelte
أنشئ هيكل مشروع SvelteKit جديدًا باستخدام CLI الرسمي، واختر الخيارات المناسبة
إنشاء مشروع باستخدام npm create svelte درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 2 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
أداة إنشاء الهيكل
الطريقة الرسمية لبدء مشروع SvelteKit هي الأمر npm create svelte@latest. فهو ينشئ تطبيقًا جاهزًا للتشغيل.
npm create svelte@latest my-appما يطلبه المعالج
سيُطلب منك اختيار قالب (skeleton أو demo app)، ودعم TypeScript، وأدوات (ESLint وPrettier وPlaywright وVitest).
خيارات القالب
يوفّر مشروع Skeleton البنية الأساسية الدنيا. أما تطبيق Demo فيتضمن مثالًا صغيرًا للعبة Sverdle لدراسته.
خيار TypeScript
اختر Yes لـ TypeScript إذا أردت أمان الأنواع. يضبط المعالج إعدادات TS تلقائيًا ويستخدم lang="ts" في كتل script.
تثبيت التبعيات
بعد انتهاء المعالج، انتقل إلى المجلد وثبّت الحزم.
cd my-app
npm installبدء خادم التطوير
استخدم البرنامج النصي dev لتشغيل خادم يدعم إعادة التحميل الفوري على العنوان http://localhost:5173.
npm run devفتح التطبيق في المتصفح
زُر العنوان المطبوع في الطرفية. من المفترض أن ترى صفحة ترحيب. عدّل الملف src/routes/+page.svelte وراقب تحديثه مباشرةً.
بناء الإنتاج
يشغّل البرنامج النصي build المترجم وينتج مجلد إخراج جاهزًا للتقديم.
npm run build
npm run previewاختيار مدير الحزم
يمكنك استخدام npm أو pnpm أو yarn. ويحظى pnpm بشعبية لكفاءته في استخدام القرص ولحلّ تبعياته الصارم.
إعداد المحرّر
ثبّت إضافة Svelte for VS Code للحصول على تمييز الصياغة وIntelliSense والتشخيصات في ملفات .svelte.
تهيئة Git اختيارية
يتيح المعالج تهيئة مستودع git. وتؤدي الموافقة إلى إضافة ملف .gitignore مناسب.
تحقّق سريع
ما الأمر الذي ينشئ مشروع SvelteKit جديدًا؟
خلاصة
يمكنك الآن إنشاء هيكل مشروع، واختيار TypeScript والأدوات، وتثبيت التبعيات، وتشغيل البرنامجين النصيين dev أو build.
الأسئلة الشائعة
هل درس «إنشاء مشروع باستخدام npm create svelte» مجاني؟
نعم — نص درس «إنشاء مشروع باستخدام npm create svelte» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «إنشاء مشروع باستخدام npm create svelte»؟
أنشئ هيكل مشروع SvelteKit جديدًا باستخدام CLI الرسمي، واختر الخيارات المناسبة تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 4.
كم من الوقت يستغرق درس «إنشاء مشروع باستخدام npm create svelte»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- ما هو Svelte ولماذا يترجم الشيفرة
- إنشاء مشروع باستخدام npm create svelte
- بنية المشروع: src وroutes وstatic
- خادم التطوير واستبدال الوحدات الفوري