Watch bundles not working

[MasterTheRock]

The wath bundle not working. I change the content of one file in a bundle and the plugin not re-build the file.

See my webpack.config (I use webpack 5)

const packages = require("./package.json");
const webpack = require("webpack");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const CleanObsoleteChunks = require('webpack-clean-obsolete-chunks');
const WebpackConcatPlugin = require('webpack-concat-files-plugin');
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");

module.exports = (env) => {
  return {
    entry: {
      search: ["./src/search/index.js"],
     //some others scripts....
    },

    devtool: env.production ? false : 'source-map',

    module: {
      rules: [
        {
          test: /\.(js)$/,
          exclude: /node_modules/,
          use: {
            loader: "babel-loader",
            options: {
              plugins: [
                "@babel/plugin-proposal-class-properties",
                ["@babel/transform-runtime"],
              ],
              presets: [
                [
                  "@babel/preset-env", {
                    "targets": {"edge": "18"},
                  }
                ]
              ],
            },
          },
        },
        {
          test: /\.scss$/,
          use: [
            {
              loader: 'file-loader',
              options: {
                name: '[name].css'
              }
            },
          ],
        },
        {
          test: /.s?css$/,
          use: [
            MiniCssExtractPlugin.loader,
            'css-loader',
            {
              loader: "postcss-loader",
              options: {
                postcssOptions: {
                  plugins: [
                    require.resolve("postcss-calc"),
                    require.resolve("postcss-combine-duplicated-selectors"),
                    require.resolve("postcss-combine-media-query"),
                    require.resolve("postcss-delete-duplicate-css"),
                  ],
                },
              }
            },
            'sass-loader',
          ],
        },
        {
          test: /\.(woff(2)?|ttf|eot|svg|png|jpg)(\?v=\d+\.\d+\.\d+)?$/,
          use: [
            {
              loader: "file-loader",
              options: {
                name: "[name].[ext]",
                outputPath: "assets/"
              }
            }
          ]
        }
      ]
    },
    resolve: {
      modules: [
        path.resolve('./src'),
        path.resolve('./scss'),
        path.resolve('./node_modules')
      ],
      extensions: ["*", ".js"],
      fallback: {
        "url": false,
        "os": false,
        "path": false
      }
    },

    output: {
      filename: "[name].js",
      path: __dirname + "/dist",
    },

    plugins: [
      new MiniCssExtractPlugin(),
      new CleanWebpackPlugin(),
      new webpack.ids.HashedModuleIdsPlugin(),
      new CleanObsoleteChunks({ deep: true }),
      new WebpackConcatPlugin({
        allowOptimization: true,
        allowWatch: true,
        bundles: [
          {
            src: [
              "template.main.js",
              //some others scripts...
            ],
            dest: './dist/build.min.js',
          },
          {
            src: "./program/expensesreport/project.js",
            dest: "./dist/expenses-report-project.min.js",
          }
        ]
      })
    ],

    watchOptions: {
      poll: true,
    },

    optimization: {
      minimize: env.production,
      minimizer: [
        new TerserPlugin({
          parallel: true,
        }),
        new CssMinimizerPlugin({
          include: /\.min\.css/,
          parallel: true,
          minimizerOptions: {
            preset: [
              "default",
              {
                discardComments: { removeAll: true },
              },
            ],
          }
        })
      ],
    },
  }
};

And my packages

"devDependencies": {
    "@babel/core": "^7.14.2",
    "@babel/plugin-proposal-class-properties": "^7.13.0",
    "@babel/plugin-transform-runtime": "^7.14.2",
    "@babel/preset-env": "^7.14.2",
    "babel-loader": "^8.2.2",
    "clean-webpack-plugin": "^4.0.0-alpha.0",
    "css-loader": "^6.2.0",
    "css-minimizer-webpack-plugin": "^3.0.2",
    "file-loader": "^6.2.0",
    "mini-css-extract-plugin": "^2.1.0",
    "postcss-calc": "^8.0.0",
    "postcss-combine-duplicated-selectors": "^10.0.3",
    "postcss-combine-media-query": "^1.0.1",
    "postcss-delete-duplicate-css": "^1.0.0",
    "postcss-loader": "^6.1.1",
    "sass": "^1.36.0",
    "sass-loader": "^12.1.0",
    "terser-webpack-plugin": "^5.1.4",
    "webpack": "^5.46.0",
    "webpack-clean-obsolete-chunks": "^0.4.0",
    "webpack-cli": "^4.7.2",
    "webpack-concat-files-plugin": "^0.5.2"
  },
  "dependencies": {
    "@babel/runtime": "^7.14.0",
    "bootstrap": "^5.0.2",
    "cross-env": "^7.0.3",
    "dagre": "^0.8.5",
    "dagre-layout": "^0.8.8",
    "jsplumb": "^2.15.5",
    "lit-element": "^2.5.1",
    "mime-types": "^2.1.28",
    "moment": "^2.29.1",
    "node-fetch": "^2.6.1",
    "noop-logger": "^0.1.1",
    "panzoom": "^9.2.5",
    "zipkin": "^0.22.0",
    "zipkin-instrumentation-fetch": "^0.22.0",
    "zipkin-transport-http": "^0.22.0"
  }

[hbendev]

Not documented unfortunately, but if you provide absolute URLs for the concatenated bundles' source urls it'll work perfectly.

import path from 'path';
// ....
{
  plugins: [
    new WebpackConcatPlugin({
      dest: path.resolve('./dist/main.js'),
      src: [path.resolve('./dist/polyfill.js'), path.resolve('./dist/main.js')]
    })
  ]
}

FYI here is the relevant function that helped me debug this issue: https://github.com/damorej-at-theinstitutes/webpack-concat-files-plugin/blob/e65d4f4f51ff2a1426fa942bc3eebae8a286fb0b/src/index.js#L163.