webpack多页面配置

const path = require('path');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  entry: {
    'index/index': './src/index/index.js',
    'login/login': './src/login/login.js',
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].[chunkHash:8].js',
    chunkFilename: "[name].bundle.js"
  },

    plugins: [
        new CleanWebpackPlugin(['dist']),
        new HtmlWebpackPlugin({

            filename: 'index/index.html',
            chunks: ['common/utils', 'common/vendor', 'index/index']
        }),

        new HtmlWebpackPlugin({

            filename: 'login/login.html',
            chunks: ['common/utils', 'common/vendor', 'login/login']
        })
    ],

    optimization: {
        splitChunks: {
            cacheGroups: {
                vendor: {   // 抽离第三方插件
                    test: /node_modules/,   // 指定是node_modules下的第三方包
                    chunks: 'initial',
                    name: 'common/vendor',  // 打包后的文件名，任意命名
                    // 设置优先级，防止和自定义的公共代码提取时被覆盖，不进行打包
                    priority: 10
                },
                utils: { // 抽离自己写的公共代码，utils这个名字可以随意起
                    chunks: 'initial',
                    name: 'common/utils',  // 任意命名
                    minSize: 0    // 只要超出0字节就生成一个新包
                }
            }
        }
    },

};