Webpack 4 mini-css-extract-plugin error: вам может понадобиться соответствующий загрузчик для обработки этого типа файла

Question

новый для веб-пакета, Попытка экспорта файла scss в css с использованием mini-css-extract-plugin безуспешно, Я получаю эту ошибку:

ERROR in ./assets/src/css/style.scss (./node_modules/css-loader!./node_modules/sass-loader/lib/loader.js!./node_modules/mini-css-extract-plugin/dist/loader.js??ref--5-3!./assets/src/css/style.scss)
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleParseError: Module parse failed: Unexpected token (1:4)
You may need an appropriate loader to handle this file type.

корпус { | цвет фона: зеленый; | }

это содержимое файла webpack.config.js.

const path = require('path');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  entry: './assets/src/js/main.js',
  plugins: [
    // Adding our UglifyJS plugin
    new UglifyJSPlugin(),
    new MiniCssExtractPlugin()
  ],
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'assets/dist/js')
  },
  module: {
    rules: [
        {
            test: /\.js$/,
            exclude: /(node_modules|bower_components)/,
            use: {
            loader: 'babel-loader',
                options: {
                    presets: ['babel-preset-env']
                }
            }
        },
        //sass
        {
            test: /\.scss$/,
            use: [
                    {
                    loader: "style-loader" // creates style nodes from JS strings
                }, {
                    loader: "css-loader" // translates CSS into CommonJS
                }, {
                    loader: "sass-loader" // compiles Sass to CSS
                },{
                    loader: MiniCssExtractPlugin.loader,
                    options: {
                        // you can specify a publicPath here
                        // by default it use publicPath in webpackOptions.output
                        filename: "./assets/dist/css/style.css",
                        chunkFilename: "[name].css"
                      }

                }
            ]
        },
       // css
        {
            test: /\.css$/,
            loader: 'style-loader',
        },
        {
            test: /\.css$/,
            loader: 'css-loader',
            options: {
                minimize: true
            }
        }
    ]
  }
};

это полное содержимое style.scss файла

body{
    background-color: green;
}

Это структура папок:

Что за отсутствующий загрузчик? В чем проблема? Я прочитал несколько ответов, но безуспешно.