How to minify a single css file with webpack?

1

npm install mini-css-extract-plugin optimize-css-assets-webpack-plugin --save-dev

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');

module.exports = {
  entry: './src/styles.css',
  output: {
    filename: 'styles.min.css'
  },
  module: {
    rules: [
      {
        test: /.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader'
        ]
      }
    ]
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: 'styles.min.css'
    }),
    new OptimizeCssAssetsPlugin()
  ]
};

1

webpack --config webpack.config.js