How to use HtmlWebpackPlugin for multiple files with wildcard?

Question

I have many HTML files need to work with and I am using HtmlWebpackPlugin to generate them. Below is one of the config in my webpack:

new HtmlWebpackPlugin({
                filename: 'index.html',
                template: 'index.html',
                inject: 'body'
            }),

it works fine to load one HTML file. But can I use it to manage multiple files wiht wildcard? Like below configuration:

new HtmlWebpackPlugin({
                    filename: '[filename].html',
                    template: 'src/components/**/*.html',
                }),

Answer 1

The only way to achieve this is using multiple instances of the HtmlWebpackPlugin.

Here is a sample gist explaining how it can be done: https://gist.github.com/prasann/cc797f4ab0715e7696d946647668d43b

More details on how to: https://github.com/jantimon/html-webpack-plugin/issues/218