Minification not working as expected

[mbenedettini]

Not sure if this is a bug or config issue.

• Operating System: Mac OS
• Node Version: 14.15.3
• NPM Version: 6.14.9
• webpack Version: 5.17.0
• style-loader Version: 2.0.0

Expected Behavior

Using mini-css-extract-plugin the bare minimal css is extracted, as in https://github.com/mbenedettini/style-loader-css-minification/blob/master/dist-mini-css-extract-plugin/index.946970ea29e4224a08d1.css

For that build I have enabled mini-css-extract-plugin and disabled style-loader in the chain of loaders.

Actual Behavior

Comments are not removed and a lot of other unnecessary things are generated, making the bundle much larger than expected in a large project: https://raw.githubusercontent.com/mbenedettini/style-loader-css-minification/master/dist/index.8e16b634b56fdd959495.js

This example was generating with the config as can be found in the repo: style-loader enabled and mini-css-extract-plugin disabled.

Code

https://github.com/mbenedettini/style-loader-css-minification

How Do We Reproduce?

See github repo, dist directory includes bundle with style-loader and I have also included dist-mini-css-extract-plugin with a run with style-loader disabled and using mini-css-extract-plugin instead.

Command used to build:

NODE_ENV=production ./node_modules/webpack/bin/webpack.js --env production --mode production --config webpack.config.js --progress

[alexander-akait]

We need hook here... it is feature, anyway you can use cssnano as postcss plugin for postcss-loader as workaround

[mbenedettini]

Thanks, the workaround is good but I was ending up with a larger bundle than in Webpack4 because it seemed that the same Antd styles were present in more than one chunk, like it was being duped somehow, and also the javascript in less that they use was not being minified.

I ended up just using mini-css-extract-plugin for now, thanks anyway for the quick response

[maddhruv]

Hey @mbenedettini you can also use the CssMinimizerWebpackPlugin https://webpack.js.org/plugins/css-minimizer-webpack-plugin/ which does the minification using cssnano under the hood

[alexander-akait]

Close in favor webpack-contrib/css-minimizer-webpack-plugin#80, we will fix it in near future