عن المشروع
Vitesse هو قالب بدء عالي التخصيص لبناء تطبيقات الويب باستخدام Vite و Vue 3، أنشأه Anthony Fu. يهدف إلى توفير إعداد سريع ومُهيأ مسبقًا حتى يتمكن المطورون من تحويل الأفكار إلى تطبيقات عاملة بسرعة دون قضاء وقت في التكوين. صُمم القالب ليكون سريعًا، مستفيدًا من الأدوات الحديثة مثل pnpm و esbuild و Vite، ويتضمن مجموعة مختارة من الميزات والإضافات الجاهزة.
**الميزات الرئيسية**
- **Vue 3 + Vite**: مبني على أحدث إصدار من Vue 3 مع Vite لتطوير وبناء سريعين.
- **التوجيه القائم على الملفات**: يستخدم unplugin-vue-router لتوليد المسارات تلقائيًا من مجلد src/pages.
- **الاستيراد التلقائي**: يتم استيراد المكونات وواجهات البرمجة (مثل Composition API) والأيقونات تلقائيًا، مما يقلل من الكود المتكرر.
- **إدارة الحالة**: Pinia لإدارة حالة بديهية وآمنة من حيث الأنواع.
- **نظام التخطيطات**: يدعم تخطيطات متعددة عبر vite-plugin-vue-layouts.
- **دعم PWA**: مدمج مع vite-plugin-pwa لإمكانيات تطبيقات الويب التقدمية.
- **التنسيق**: UnoCSS لـ CSS ذري فوري عند الطلب، مع دعم أي مجموعة أيقونات عبر Iconify.
- **التدويل**: Vue I18n مع unplugin-vue-i18n لدعم متعدد اللغات.
- **ماركداون**: كتابة ماركداون كمكونات Vue باستخدام unplugin-vue-markdown مع تلوين صيغة Shiki.
- **توليد المواقع الثابتة**: عبر vite-ssg، مع تحسين CSS الحرج باستخدام beasties.
- **الاختبار**: Vitest لاختبارات الوحدة و Cypress لاختبارات E2E، مدمجة مع GitHub Actions.
- **TypeScript**: دعم كامل.
- **النشر**: نشر بدون إعدادات إلى Netlify، بالإضافة إلى دعم Docker للبناء الإنتاجي.
**الإضافات المضمنة**
- Vue Router و Pinia و VueUse و Unhead لإدارة الرأس، و vite-plugin-vue-devtools لتحسين تجربة المطور.
- فرض نمط الكود باستخدام ESLint مع @antfu/eslint-config (اقتباسات مفردة، بدون فواصل منقوطة).
- إضافات VS Code موصى بها لـ Vite و Volar و Iconify IntelliSense و i18n Ally و ESLint.
**الاختلافات**
ألهم القالب عدة اختلافات يحافظ عليها المجتمع، بما في ذلك:
- vitesse-lite: نسخة خفيفة.
- vitesse-nuxt3: لـ Nuxt 3.
- vitesse-webext: لإضافات المتصفح.
- vitesse-ssr-template: مع دعم SSR.
- vitailse: مع TailwindCSS.
- vitesse-h5: لتطبيقات الجوال.
- vitesse-solid: لـ SolidJS.
**الاستخدام**
- **التطوير**: شغّل pnpm dev وقم بزيارة http://localhost:3333.
- **البناء**: شغّل pnpm build لإنشاء مجلد dist.
- **النشر**: انشر إلى Netlify بربط المستودع، أو استخدم Docker مع docker buildx build . -t vitesse:latest وشغّل مع docker run --rm -it -p 8080:80 vitesse:latest.
**ملاحظة**: يوصي المؤلف باستخدام Nuxt للمشاريع الجديدة بسبب تجربة مطور Vue أفضل وصيانة أكثر اتساقًا، حيث أن Vitesse من فترة الانتقال المبكرة لـ Vite/Vue 3 وقد تكون التحديثات أبطأ. ومع ذلك، يظل مرجعًا قويًا للتعلم وللمشاريع التي تتوافق مع إعداده المخصص.
**قائمة التحقق للتخصيص**
عند استخدام القالب، قم بتحديث اسم المؤلف في LICENSE، والعنوان في App.vue، واسم المضيف في vite.config.ts، والأيقونة في public، وإزالة مجلد .github، وتنظيف ملفات README والمسارات.
بشكل عام، Vitesse هو قالب بدء قوي وغني بالميزات للمطورين الذين يريدون إعدادًا شاملًا ومخصصًا لتطبيقات Vue 3، مع التركيز على السرعة وتجربة المطور.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.