使用Webpack配置创建React应用时出现无效配置错误

Question

无法使用react配置webpack

下面是错误：

无效的配置对象。已使用与API模式不匹配的配置对象初始化Webpack。  -configuration.entry ['main']不应两次包含项目“-”。    ->非空字符串的非空数组

我已经配置了webpack并尝试了

下面是webpack.config.js

 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')}
   )
  ]
}

Answer 1

我认为这会起作用

 const path = require('path');
 const HWP = require('html-webpack-plugin');
 module.exports = {
   entry: ['./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')}
   )
  ]
}

Answer 2

如下所示在package.json中更改脚本启动命令，使其生效，

"start": "webpack-dev-server --config webpack.config.js --port 3000",