اذهب إلى المحتوى
  • 0

خطأ Dev Server has been initialized using an options object that does not match the API schema عند تشغيل خادم webpack

عبد النور محمد

السؤال

لا يمكنني تشغيل خدمة webpack

const webpack = require('webpack')
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')

module.exports = {
    mode: 'development',
    devServer: {
        historyApiFallback: true,
        contentBase: path.resolve(__dirname, './dist'),
        open: true,
        compress: true,
        hot: true,
        port: 8080,
        allowedHosts: 'all',
    },
    entry: {
        main: path.resolve(__dirname, './src/index.js'), // точка входа приложения
    },
    output: {
        path: path.resolve(__dirname, './dist'), // точка выхода приложения, директория
        filename: '[name].bundle.js',
    },
    plugins: [
        new HtmlWebpackPlugin({
            title: 'webpack Boilerplate',
            template: path.resolve(__dirname, './src/template.html'), // шаблон
            filename: 'index.html', // название выходного файла
        }),
        new CleanWebpackPlugin(),
        new webpack.HotModuleReplacementPlugin(),
    ],
    module: {
        rules: [...],
    }
}

الخطأ

skif@PC:~/WebstormProjects/webpack-tutorial$ yarn start
yarn run v1.22.5
$ webpack serve
[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'contentBase'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
skif@PC:~/WebstormProjects/webpack-tutorial$ 

 

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

Recommended Posts

  • 1

يبدو أنك تستخدم النسخة webpack رقم 5 وهي لا تدعم الخاصية contentBase غير نسخة webpack الى 4 كالتالي (بما انك تستعمل yarn)

yarn add webpack@4


أو يمكنك نقل الخاصية تحت الخاصية static لتصبح كالتالي

devServer: {
  static: {
    contentBase: path.resolve(__dirname, './dist'),
  },
  historyApiFallback: true,
  open: true,
  compress: true,
  hot: true,
  port: 8080,
  allowedHosts: 'all',
}

 

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

  • 1

يرجى تغيير السطر التالي 

contentBase: path.resolve(__dirname, './dist'),

إلى السطر التالي 

contentBase: path.join(__dirname, './dist'),

أو يمكنك إضافة كلمة contentBase إلى أوبجكت static كما في السطر التالي 

static: {
    contentBase: path.resolve(__dirname, './dist'),
  },

لأنه يبدو أن كلمة contentBase تم تجاهلها.

تم التعديل في بواسطة أسامة زيادة
رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...