Как исключить сделать чтобы chunks не накапливались в HtmlWebpackPlugin в webpack?

Question

[Programep]

Подскажите, пожалуйста, как сделать чтобы webpack делал при сборке такую структуру директорий:
- dist/examples/basic-example
- dist/examples/comments
- dist/examples/connectors
- dist/examples/collapsable
Внутри каждой директории, чтобы был index.html но чтобы добавлялся только указанный в chunks свойстве собранный js-скрипт. Сейчас если не указывать excludeChunks, то во все index.html включаются все chunks указанные в конфигах к HtmlWebpackPlugin. Смотрел пример https://github.com/jantimon/html-webpack-plugin/bl..., но там все также при объявлении chunks и entry, хотя в примере от webpack работает, а в моем проекте нет.
Сейчас есть такой конфиг:

const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const webpack = require('webpack');
const CopyPlugin = require("copy-webpack-plugin");
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

module.exports = {
  mode: 'development',
  target: "web",
  stats: {
    errorDetails: true,
    children: true,
  },
  entry: {
    "examples/basic-example/basic-example": path.resolve(__dirname, 'src/examples/basic-example/basic-example.ts'),
    "examples/collapsable/collapsable": path.resolve(__dirname, 'src/examples/collapsable/collapsable.ts'),
    "examples/comments/comments": path.resolve(__dirname, 'src/examples/comments/comments.ts'),
    "examples/connectors/connectors": path.resolve(__dirname, 'src/examples/connectors/connectors.ts'),
  },
  plugins: [
    new CleanWebpackPlugin(),
    new MiniCssExtractPlugin({
      // Options similar to the same options in webpackOptions.output
      // all options are optional
      filename: "[name].css",
      chunkFilename: "[id].css",
      // ignoreOrder: false, // Enable to remove warnings about conflicting order
    }),
    new HtmlWebpackPlugin({
      inject: true,
      template: "src/examples/basic-example/index.html",
      filename: "examples/basic-example/index.html",
      chunks: 'examples/basic-example/basic-example',      
      excludeChunks: ['examples/basic-example/collapsable', 'examples/comments/comments', 'examples/connectors/connectors']
    }),
    new HtmlWebpackPlugin({
      inject: true,
      template: "src/examples/collapsable/index.html",
      filename: "examples/collapsable/index.html",
      chunks: 'examples/collapsable/collapsable',
      excludeChunks: ['examples/basic-example/basic-example', 'examples/comments/comments', 'examples/connectors/connectors']
    }),
    new HtmlWebpackPlugin({
      inject: true,
      template: "src/examples/comments/index.html",
      filename: "examples/comments/index.html",
      chunks: 'examples/comments/comments',
      excludeChunks: ['examples/basic-example/basic-example', 'examples/collapsable/collapsable', 'examples/connectors/connectors']
    }),
    
    new HtmlWebpackPlugin({
      inject: true,
      template: "src/examples/connectors/index.html",
      filename: "examples/connectors/index.html",
      chunks: 'examples/connectors/connectors',
      excludeChunks: ['examples/basic-example/basic-example', 'examples/collapsable/collapsable', 'examples/comments/comments']
    }),
    new webpack.HotModuleReplacementPlugin(),
    new CopyPlugin({
      patterns: [
        { from: "src/examples/headshots", to: "examples/headshots" },
        { from: "src/examples/collapsable/img", to: "examples/collapsable/img" },
        { from: "src/examples/comments/avatar.jpg", to: "examples/comments/avatar.jpg" }
      ],
    }),
  ],
  output: {
    filename: "[name].js",
    path: path.resolve(__dirname, "dist"),
  },
  devServer: {
    compress: true,
    port: 9000,
    hot: true,
  },
};