كيفية تفعيل المسارات المحلية في Nuxt 3.14 مع @nuxt/i18n

تعتبر مسارات التوطين (localization routes) من العناصر الأساسية في تطوير التطبيقات المتعددة اللغات، حيث تساهم في تحسين تجربة المستخدم وتسهيل الوصول إلى المحتوى بلغات مختلفة. إذا كنت تستخدم Nuxt 3.14 مع مكتبة @nuxt/i18n، ستجد أن إعداد هذه المسارات بطريقة صحيحة يمكن أن يكون تحديًا. في هذا المقال، سنستعرض خطوات الحصول على مسارات محلية تعمل بالشكل المطلوب في هذا السياق.

إعداد المشروع مع @nuxt/i18n

لبدء العمل، عليك التأكد من أنك قمت بإعداد Nuxt بالشكل المناسب. الخطوة الأولى تتضمن تثبيت مكتبة @nuxt/i18n، ثم يجب عليك إضافة ملف إعداد i18n.config.ts إلى المشروع الخاص بك. هذه الخطوة تضمن تكامل التوجيهات المتعددة اللغات بشكل سلس في التطبيق.

تهيئة ملفات الإعداد

بعد إعداد المكتبة، يجب عليك تعديل ملف nuxt.config.ts لإضافة الإعدادات الخاصة بالتوطين. من الضروري أن تتأكد من تضمين الكود التالي:

export default defineNuxtConfig({
  // خيارات أخرى
  i18n: {
    vueI18n: './i18n.config.ts'
  }
})

بعد ذلك، عليك إعداد ملف i18n.config.ts. يجب أن يبدو كالتالي:

export default defineI18nConfig({
  legacy: false,
  locale: 'de',
  defaultLocale: 'de',
  globalInjection: true,
  messages: { de, en },
  customRoutes: 'config'
})

هذا الإعداد يحدد اللغة الافتراضية ويعطيك القدرة على استخدام ترجمات متعددة ضمن التطبيق.

إنشاء الصفحات متعددة اللغات

عند إنشاء الصفحات الخاصة بك، عليك استخدام بنية كل صفحة لتكون متوافقة مع اللغات المختلفة. على سبيل المثال، إذا كان لديك ملف about.vue داخل مجلد الصفحات/[localized]/، يمكنك البدء في كتابة المحتوى الخاص بك بلغة معينة من خلال مترجم النصوص. استخدم المتغيرات أو الترجمة المخصصة للوصول إلى النصوص الصحيحة لكل لغة.

التأكد من عمل جميع التوجيهات بشكل صحيح

إذا وجدت أن إعداد المسارات المحلية (localized routes) لا يعمل كما هو متوقع، فقد تحتاج إلى مراجعة إعداداتك والتأكد من أنك لم تفوت أي خطوة مهمة. تحقق من أن الأقواس والتنسيقات صحيحة، وتأكد من استخدام لغة البرمجة بشكل صحيح.

كما يمكنك مراجعة المراجع والمساعدة من المجتمع إذا واجهت أي مشاكل. يجب أن تكون مكتبة @nuxt/i18n سهلة الاستخدام، ولكن قد تتطلب التهيئة الدقيقة للحصول على أفضل النتائج.

التجربة النهائية

بعد الانتهاء من كل هذه الخطوات، قم بتشغيل التطبيق الخاص بك وتحقق من أن المسارات المحلية تعمل بالشكل المتوقع. قم بالتبديل بين اللغات المختلفة وتأكد من أن جميع الصفحات تتجاوب بشكل صحيح.

إن الحصول على مسارات محلية للعمل في Nuxt 3.14 باستخدام مكتبة @nuxt/i18n قد يبدو تحديًا في البداية، ولكن مع الخطوات الصحيحة والفهم الجيد للإعدادات، يمكنك أن تجعل التطبيق الخاص بك متعدد اللغات بكل سلاسة. استعد لاستقبال زوار من مختلف الثقافات واللغات مع تجربة سلسة ومميزة.

عند الانتهاء، تذكر أن تطبيق التقنيات الحديثة بشكل صحيح هو مفتاح نجاح أي مشروع برمجي. سواء كنت مطورًا متمرسًا أو مبتدئًا، فإن الاتقان في استخدام الأدوات المتاحة سيساهم في تعزيز جودة التطبيق وتحسين تجربة مستخدمه.