مشکل در bundle کردن asset ها در reactJS با webpack

سلام
من در پروژه reactJS که دارم تعدادی فایل css مثل bootstrap.css , font-awesome.min.css , style.css در مسیر src/assets/css و تعدادی فایل js مثل jquery.js , bootstrap,js در مسیر src/assets/js دارم می خوام همه فایل css به یک فایل .min در داخل public/asset/css تبدیل بشن همچنین با فایل های js همین کار می خوام انجام بدم و فقط اون دو تا فایل رو در index.html فراخوانی کنم و چند فایل css و js فراخوانی نکنم.
از webpack و scss استفاده کردم

فایل زیر app.scss هست که داخل /src/assets/css موجود هست

@import './vendor/font-awesome.min.css';
@import './vendor/adminlte.min.css';
@import './vendor/bootstrap-rtl.min.css';
@import './style.scss';

با استفاده از webpack به app.min.css در مسیر public/assets/css تبدیل میشه
مشکل این جاست که نمی تونه style.scss را minfy کنه
پایین هم فایل webpack.config.js است

const path = require("path")
const miniCssExtractPlugin=require('mini-css-extract-plugin')

module.exports = {
  entry: {
    "app.min": './src/assets/css/app.scss'
  },
  output: {
        filename : 'app.min.css',
        path : path.resolve(__dirname,'public/assets/css'),
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          miniCssExtractPlugin.loader,
          "css-loader"
        ],
      },
      {
          test : /\.s[ac]ss$/,
          use : [  
            'sass-loader' ,
            miniCssExtractPlugin.loader ,
            'css-loader'  
       ]},
          {
        test : /\.(woff|woff2|ttf|eot|otf|svg)$/,
        use : [
            {
                loader : 'file-loader',
                options : {
                    publicPath : '../fonts' ,
                    outputPath : '../fonts' ,
                    name : '[name].[ext]'
                }
            } 
         ]
    }
    ],
  },
  plugins: [
    new miniCssExtractPlugin()
  ],
}