webpack. Compiling multiple Less into 1 css file?

Question

css

Started to deal with Webpack. I want all less files to be compiled into one style.css when building.

src
----less
--------style.less
--------style.css
---------blocks
----------------header-block.less
----------------page-block.less

style.less:

@import "blocks/header-block.less";
@import "blocks/page-block.less";

webpack.config.js:

...
  module: {
    rules: [
      {
        test: /style\.less$/,
        loader: 'less-loader'
      }
    ]
  }

Now, when building, all the contents of blocks/*.less are compiled into style.css only after any change is made in the style.less file (nothing happens after changes in the blocks/*.less files), additional files are also created:

src
----less
--------style.less
--------style.css
---------blocks
----------------header-block.less
----------------header-block.css
----------------page-block.less
----------------page-block.css

How to configure config to create only one style.css with all imported blocks without touching style.less?