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

السؤال

نشر

لا يمكنني تشغيل خدمة 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
نشر (معدل)

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

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

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

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

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

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

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

تم التعديل في بواسطة أسامة زيادة
  • 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',
}

 

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

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

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

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   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.

  • إعلانات

  • تابعنا على



×
×
  • أضف...