Webpack собирает js и css, когда меняется только css

Question

Я создаю сайт с php и дизайном материалов для начальной загрузки.Я также использую sass для стиля.Я управляю JavaScript и CSS с веб-пакИ сделал конфигурацию, чтобы все файлы были экспортированы в папку dist.Проблема в том, что когда я изменяю строку в файле scss, все «вещи» экспортируются.Javascript и CSS.Это проблема, потому что экспорт занимает много времени.1000 мс + для изменения строки css.

Я уже пытался создать разные точки входа и поместить scss в другие файлы.Результаты были одинаковыми.

webpack.config.js

const path = require('path');
const webpack = require('webpack');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin')
module.exports = {
    entry: {
        main: ['./css/style.scss', './node_modules/bootstrap-material-design/scss/bootstrap-material-design.scss', './src/app.js'],
    },
    mode: 'development',
    devtool: 'source-map',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    },
    module: {
        rules: [
            {
                test: require.resolve('jquery'),
                use: [{
                    loader: 'expose-loader',
                    options: 'jQuery'
                }, {
                    loader: 'expose-loader',
                    options: '$'
                }],
            },
            {
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: 'css-loader',
                        options: {
                            sourceMap: true
                        }
                    },
                    {
                        loader: 'postcss-loader',
                        options: {
                            sourceMap: true,
                            plugins: function () {
                                return [
                                    require('precss'),
                                    require('autoprefixer')
                                ];
                            },

                        }
                    },
                    {
                        loader: 'sass-loader',
                        options: {
                            sourceMap: true
                        }
                    }
                ]
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: 'style.css',
        }),
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            Popper: ['popper.js', 'default']
        }),
        new CleanWebpackPlugin(),
    ],
};

app.js

import 'bootstrap';
import 'bootstrap-material-design';
$(document).ready(function () {
    $('body').bootstrapMaterialDesign();
}
);

style.scss

@import 'custom.scss';
@import 'my-account.scss';

Когда я изменяю строку в файле javascript, экспортируется только этот файл, а CSS не трогается.Мне бы хотелось того же поведения, но этот css экспортировался бы, а js не тронулся.

Поскольку я использую плагин для извлечения css, я думаю, что он не нужен для генерации js-файлов.