I can't get compiled scss to single css-file using webpack

Question

Нere is my webpack.config.js:

After i run npm run watch

 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
    module.exports = {
      mode: 'production',
      entry: './catalog/view/theme/default/sas/common.scss',
      plugins: [
        new MiniCssExtractPlugin({
          // Options similar to the same options in webpackOptions.output
          // both options are optional
          filename: "./catalog/view/theme/default/stylesheet/stylesheet.css",


        })
      ],
      module: {
        rules: [
          {
            test: /\.scss$/,
            use: [
              MiniCssExtractPlugin.loader,
              {
                loader: "css-loader",
                options: {
                  modules: true,
                  sourceMap: true,
                  importLoader: 2
                }
              },
              'postcss-loader',
              "sass-loader"
            ],
          }
        ]
      }
      ,
      watch: true,
    }

I have read a lot of examples but still confused - none doesn't work.Google just give You bunch of useful info.

Answer 1

The problem has been solved by adding in config:

 output: {
path: path.resolve(__dirname, "catalog/view/theme/default/css"),

},

I didn't noticed that file with css has been saved to './src/.../catalog/view/theme/default/sas/common.scss' folder, so the "output.path" - is mandatory property.