how to avoid "Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema."

Question

I am working with webpack to setup a react project. but after running command below

npm start

I have got following error in terminal

× ｢wds｣: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.entry['main'] should not contain the item '—' twice.
   -> A non-empty array of non-empty strings

here is my webpack.config.js file

const path = require('path');
const HWP = require('html-webpack-plugin');
module.exports = {
    entry: path.join(__dirname, '/src/index.js'),
    output: {
        filename: 'build.js',
        path: path.join(__dirname, '/dist')},
    module:{
        rules:[{
           test: /\.js$/,
           exclude: /node_modules/,
           loader: 'babel-loader'
        }]
    },
    plugins:[
        new HWP(
           {template: path.join(__dirname,'/src/index.html')}
        )
    ]
}

And below is the code for package.json

{
  "name": "aragon-connect-1.1",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "start": "webpack-dev-server — mode development — open — hot",
    "build": "webpack — mode production"
  },
  "author": "Author Name",
  "license": "ISC",
  "dependencies": {
    "react": "^16.13.1",
    "react-dom": "^16.13.1"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.1.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "html-webpack-plugin": "^4.3.0",
    "webpack": "^4.44.1",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0"
  }
}

Can anyone let me know about where I am getting wrong? Thanks in advance

Not sure if it's a formatting problem, but I find this very strange: — mode development. It should be --mode development, with two hyphens not followed by space. Same with the other parameters in start and build. — David González
– David González, Commented Jul 30, 2020 at 10:49

David González · Accepted Answer · 2020-07-30 11:34:04Z

4

Can you try with this scripts?

"scripts": {
  "start": "webpack-dev-server --mode development --open --hot",
  "build": "webpack --mode production"
}

Also, make sure webpack config is called webpack.config.js?

answered Jul 30, 2020 at 11:34

David González

4551 gold badge7 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

brijesh-pant · Accepted Answer · 2020-07-31 04:07:30Z

0

The issue is in the options format you're using in scripts

  "scripts": {
    "start": "webpack-dev-server — mode development — open — hot",
    "build": "webpack — mode production"
  },

Options passed in running webpack build should be used like --mode, but you've used - above.

answered Jul 31, 2020 at 4:07

brijesh-pant

1,1851 gold badge12 silver badges20 bronze badges

Comments

Yilmaz · Accepted Answer · 2020-08-01 07:37:33Z

0

entry assumes to have relative path not absolute path.

entry: {  main: "./src/index.js" },

answered Aug 1, 2020 at 7:37

Yilmaz

51k19 gold badges226 silver badges278 bronze badges

Comments

César Augusto · Accepted Answer · 2023-10-31 03:01:09Z

0

Check that in your package.json file change the "main" property

{
"main": "node_modules/expo/AppEntry.js",
}

answered Oct 31, 2023 at 3:01

César Augusto

7561 gold badge8 silver badges9 bronze badges

Collectives™ on Stack Overflow

how to avoid "Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema."

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related