نشر الإنتاج
التطوير مقابل الإنتاج
أثناء التطوير ، يوفر Vue عددًا من الميزات لتحسين تجربة التطوير:
- العطف بين الأخطاء و العثرات الشائعة
- الخاصيات / التحقق من صحة الأحداث
- خطافات تصحيح الأخطاء التفاعلية
- أدوات التطوير المدمجة
ومع ذلك ، تصبح هذه الميزات عديمة الفائدة في الإنتاج. يمكن أن تتحمل بعض فحوصات التحذير أيضًا قدرًا صغيرًا من نفقات الأداء. عند النشر في الإنتاج ، يجب أن نتخلى عن جميع فروع التعليمات البرمجية غير المستخدمة، والمصممة للتطوير فقط للحصول على حجم حمولة أصغر وأداء أفضل.
بدون أدوات البناء
إذا كنت تستخدم Vue بدون أداة بناء عن طريق تحميلها من CDN أو برنامج نصي مستضاف ذاتيًا ، فتأكد من استخدام بنية الإنتاج (ملفات dist التي تنتهي بـ .prod.js) عند النشر في الإنتاج. تُصغر إصدارات الإنتاج مسبقًا مع إزالة جميع فروع التعليمات البرمجية المخصصة للتطوير فقط.
- في حالة استخدام عملية بناء عامة (بواسطة الكائن العام لـ
Vue): استخدمvue.global.prod.js. - في حالة استخدام إصدار ESM (بواسطة عمليات استيراد ESM الأصلية): استخدم
vue.esm-browser.prod.js.
راجع دليل ملف dist لمزيد من التفاصيل.
مع أدوات البناء
المشاريع المنشأة عبر create-vue (المستند على Vite) أو Vue CLI (المستند على webpack) مهيأة مسبقًا لإصدارات الإنتاج.
إذا كنت تستخدم إعدادًا مخصصًا ، فتأكد من:
- ينتقل
vueإلىvue.runtime.esm-bundler.js. - تهيئة شارات التصريف بشكل صحيح.
process.envيستبدل بـ.NODE_ENV "production"أثناء البناء.
مراجع إضافية:
تتبع أخطاء وقت التشغيل
يمكن استخدام معالج الأخطاء على مستوى التطبيق للإبلاغ عن الأخطاء لخدمات التتبع:
js
import { createApp } from 'vue'
const app = createApp(...)
app.config.errorHandler = (err, instance, info) => {
// الإبلاغ عن خطأ لخدمات التتبع
}توفر خدمات مثل Sentry و Bugsnag أيضًا اندماجات رسمية لـ Vue.