webpack3最新版本配置研究（三）多入口，html-webpack-plugin, extract-text-webpack-plugin

虽然现在有很多单页应用，不过还是多页面用的比较多一些，先研究了下多入口的配置

//随便生成一个js来测试，我在根目录新建了一个entry.js文件
console.log('123');

之前的webpack.config.js的配置是这样的

  entry: __dirname + "/index.js",
  output:{
    // 打包后存放地址
    path: __dirname,
    // 输出后的文件名
    filename: 'bundle.js'
  }

需要修改一下他的结构

entry: {
    index: __dirname + "/index.js",
    entry: __dirname + '/entry.js'
  },
  output: {
    filename: 'js/[name].js',
    path: __dirname + '/public'
  },

//顺便把他的img loader的地址就改下，删除name后面的build，因为output里面写了path，后面都会继承
{
 test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
 loader: "url-loader?limit=8192&name=img/[name].[hash:8].[ext]"
}

然后npm run build会出现下面的结构，生成了一个public的文件夹里面的生成了对应的文件，这样以后js在webpack里面注册一下之后就会生成到public里面，修改下index.html的script路径就能使用了