Webpack + Sass + Autoprefixer Are Not Generating The Css File

I would like to compile my SCSS files to main.min.css with webpack. I'm using autoprefixer and the final file is not being generated. I tried a lot of options and I'm stuck now. Wh

Solution 1:

webpack.config.js - hear a link to an example can be useful ToDoList

js

{
  test: /\.js$/,
  exclude: /node_modules/,
  use: {
    loader: 'babel-loader',
  },
},

css/sass

 {
    // CSS SASS SCSS
    test: /\.(css|sass|scss)$/,
    use: [
      argv.mode === 'development'
        ? 'style-loader'
        : MiniCssExtractPlugin.loader,
      {
        loader: 'css-loader',
        options: {
          importLoaders: 2,
          sourceMap: true,
        },
      },
      {
        loader: 'postcss-loader'
      },
      {
        loader: 'sass-loader',
        options: {
          sourceMap: true,
        },
      },
    ],
 },

Add a file to the root folder postcss.config.js

module.exports = {
  plugins: {
   autoprefixer: {},
 },
};

package.json add

"browserslist":["> 1%","last 1 version","not dead"]

.babelrc

{
  "presets": [
   [
    "@babel/preset-env",
    {
      "useBuiltIns": "usage",
      "corejs": 3
    }
   ]
 ]
}