vue.js - صفحة HTML ثابتة مُولدة بواسطة NuxtJS لا تحمل جافاسكريبت عند استدعاء /index.html

أعمل على مشروع NuxtJS سيتم توليده للاستخدام الثابت. بالطبع يستخدم JavaScript على سبيل المثال للتنقل، وبعض النماذج والمزيد.

عندما أستخدم الصفحة مع npm run dev كل شيء يعمل بشكل جيد.

بعد التصدير باستخدام npm run build && npm run generate أقوم بنشر المحتوى المولد من /dist على خادمي (CDN الذي يطلبه المستخدم، في هذه الحالة Google Cloud Storage) يمكنني استخدام الصفحة دون أي مشاكل إذا لم أضف اللاحقة index.html.

مثال :

زيارة https://page.com/subpage/ تعمل بشكل جيد

لكن

زيارة https://page.com/subpage/index.html ليس حقًا.

نعم، إنه يعرض المحتوى باستخدام CSS و DOM، لكن جافاسكريبت لا تعمل على الإطلاق. في أدوات المطورين في جوجل كروم، أستطيع أن أرى أنه في كلتا الحالتين يبدو أن جافاسكريبت قد تم تحميلها، ولكن لم يتم استدعاؤها في السيناريو الثاني. انظر لقطات الشاشة المرفقة. كلاهما كان متشابهاً.

ملف إعدادات nuxt-Config الخاص بي شبه فارغ بخصوص التكوينات الخاصة بالعرض والبناء. لقد قمت فقط بإيقاف ressourceHints وهذا كل شيء. لست متأكدًا مما إذا كانت المشكلة تتعلق بالموجّه الذي يقبل فقط المجلد الذي يحتوي على ملف index.html. مسارات الموجّه يتم إنشاؤها ديناميكيًا بواسطة nuxtLinks.

أي أفكار؟

الإجابة رقم 1

تحديث

بعد البحث عن إجابات لمدة ساعة إلى ساعتين أخرى تقريبًا، وجدت أخيرًا حلاً.

هناك طريقة لإضافة لاحقة index.html إلى الموجه كاسم مستعار لكل المسارات.

من خلال تمديد جهاز التوجيه في إعدادات nuxt-config، يمكنك نظريًا إضافة اسم مستعار بناءً على مسار جهاز التوجيه. ليس دائمًا هو الطريقة الأفضل، ولكنه يعمل بشكل جيد في ذلك الوضع.

router: {
  extendRoutes(routes) {
    routes.forEach((route) => {
      // When options.generate.subFolders is true (default)
      const alias =
        route.path.length > 1 ? `${route.path}/index.html` : '/index.html'
      // When options.generate.subFolders is false
      // const normalizedRoute = route.path.replace(/\/$/, '') // Remove trailing slashes if they exist
      // const alias =
      //   route.path.length > 1 ? `${normalizedRoute}.html` : '/index.html'
      route.alias = alias
    })
  }
}

لقد أخذت هذا المقتطف من منشور على ريديت بواسطة animagnam (https://www.reddit.com/r/Nuxt/comments/gzwrqu/visiting_generated_site_routes_with_trailing/ftnylrt?utm_source=share&utm_medium=web2x&context=3) ويعمل بشكل مثالي في الإنتاج والاختبارات.