• 0

سبب مشكلة عدم ظهور تنسيقات العناصر في webpack

السلام عليكم

بدأت بإنشاء مشروع خاص بشركة

وقمت بتثبيت الحزم بشكل صحيح و اتبعت نفس الخطوات التي تعلمتها سابقاً

وقمت بتضمين الملفات في ملف ال (index.js) بشكل صحيح بلإضاف الى ملف ال (web pack;) أيضاً. وسطر الأوامر لا يعطي أيّ خطأ.

وأردت أن أجرب وأتأكد بأن كل شيء يعمل فأخذت شيفرة جاهزة من ال (bootstrap) ووضعتها في المشروع

ولكن لم تظهر التنسيقات !!!!

وأن الآن لا أعرف ما هي المشكلة لكي أبحث عنها وأحلها !!

ماذا يجب أن أفعل كي أعرف المشكلة؟؟؟

 

وشكراً

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 1 دقيقة مضت قال علاء الدين الزهوري:

قمت بذلك ولم تظهر التنسيقات !!!

 

شكراً لك.

مرحبا مجددا
تأكد من أنك تفتح الملف من مجلد dist وليس مجلد src
اذا استمرت المشكلة هل يمكنك ارفاق الملفات بعد التعديل؟
شكرا لك

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0

مرحبا
ربما قمت بتضمين بوتستراب بشكل خاطئ
هل يمكنك ارفاق ملفات المشروع بشكل مضغوط؟
شكرا لك

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 14 دقائق مضت قال محمد أبو عواد:

مرحبا
ربما قمت بتضمين بوتستراب بشكل خاطئ
هل يمكنك ارفاق ملفات المشروع بشكل مضغوط؟
شكرا لك

 

Travel_me.zip

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 20 دقائق مضت قال علاء الدين الزهوري:

مرحبا علاء
لديك مشكلة في هذا الكود من ملف webpack.config,js

output: {
        publicPath: '/',
                   ^^^^^
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/main.js'
    },

تقوم بتحديد مصدر الملفات بشكل خاطئ, سوف نحذف " / " ليصبح شكل الكود كالتالي

output: {
        publicPath: '',
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/main.js'
    },

ثم نقوم بتنفيذ الأمر 

npm run build

شكرا لك
 

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 8 دقائق مضت قال محمد أبو عواد:

مرحبا علاء
لديك مشكلة في هذا الكود من ملف webpack.config,js


output: {
        publicPath: '/',
                   ^^^^^
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/main.js'
    },

تقوم بتحديد مصدر الملفات بشكل خاطئ, سوف نحذف " / " ليصبح شكل الكود كالتالي


output: {
        publicPath: '',
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/main.js'
    },

ثم نقوم بتنفيذ الأمر 


npm run build

شكرا لك
 

قمت بذلك ولم تظهر التنسيقات !!!

 

شكراً لك.

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 10 دقائق مضت قال علاء الدين الزهوري:

قمت بذلك ولم تظهر التنسيقات !!!

 

شكراً لك.

تأكد من حذف الخاصية publicPath  ليصبح الكود كالتالي

output: {
  path: path.resolve(__dirname, 'dist'),
    filename: 'js/main.js'
},

وقم بعد ذلك بتنفيذ الأمر npm run build

وبعد الإنتهاء قم بفتح صفحة index.html في المتصفح الموجودة في مجلد dist وليس src وغالباً سيكون السبب أنك لم تستخدم live-srever لذلك لم تحدث الصفحة تلقائياً

تمّ تعديل بواسطة عبدالباسط ابراهيم
إضافة بعض المعلومات

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن