Уменьшить размер файла .css с помощью Webpack

с изучением webpack столкнулся с проблема минимизацией .css фала(-ов) с помощью webpack. Не могу уловить саму логику. Конфигурацию пишу в webpack.config.js я получаю ошибку ERROR in Entry module not found: Error: Can't resolve 'css-loader' in 'G:\Users\user_p1\Desktop\webpack' npm ERR! errno 2 npm ERR! [email protected] build: webpack npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the [email protected] build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! G:\Users\user_p1\AppData\Roaming\npm-cache_logs\2020-02-11T13_09_19_066Z-debug.log

const path = require("path");
const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const FixStyleOnlyEntriesPlugin = require("webpack-fix-style-only-entries");

module.exports = {
  mode: 'development',
  entry: {
    main: "./src/main.js",
    styles: "./src/styles.css"
  },
  output: {
    path: path.resolve(__dirname, "public"),
    filename: "[name].min.js",
  },
  module: {
    rules: [
      {test: /\.css$/,
       use: [MiniCssExtractPlugin.loader,"css-loader"]
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({template: "./src/index.html"}),
    new MiniCssExtractPlugin({filename: "[name].min.css"}),
    new FixStyleOnlyEntriesPlugin(),
  ]
}