webpack 多入口配置问题， 打包出来的结果变成每个html引用了所有打包的js文件

Question

如题应该怎么配置才能让html挂载对应的js文件呢。因为文件带hash，没办法用htmlWebpackPlugin来写死，或者有什么写法可以解决这个问题？

Answer 1

可不可以在plugins中定义多个HtmlWebpackPlugin, 每个Plugin中指定对应的Chunk，如下

module.exports = {

  entry: {

    'page1': './apps/page1/scripts/main.js',

    'page2': './apps/page2/src/main.js'

  },

  output: {

    path: __dirname,

    filename: "apps/[name]/build/bundle.js"

  },

  plugins: [

    new HtmlWebpackPlugin({

      inject: false,

      chunks: ['page1'],

      filename: 'apps/page1/build/index.html'

    }),

    new HtmlWebpackPlugin({

      inject: false,

      chunks: ['page2'],

      filename: 'apps/page2/build/index.html'

    })

  ]

};