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

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

بتاريخ 14 دقائق مضت قال محمد أبو عواد:

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

Travel_me.zip

بتاريخ 20 دقائق مضت قال علاء الدين الزهوري:

 

Travel_me.zip

مرحبا علاء
لديك مشكلة في هذا الكود من ملف 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

شكرا لك
 

بتاريخ 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 دقيقة مضت قال علاء الدين الزهوري:

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

 

شكراً لك.

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

بتاريخ 10 دقائق مضت قال علاء الدين الزهوري:

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

 

شكراً لك.

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

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

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

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