Autoprefixer in Webpack not prefixing

Question

I've put together my first, very simple Webpack config from scratch. In this I would like to bundle JS and also compile, minimize and autoprefix SCSS.

The code looks like this:

webpack.config.js

const path = require('path');

module.exports = {
  entry: ['./src/index.js', './src/scss/main.scss'],
  output: {
    filename: 'application.js',
    path: path.resolve(__dirname, 'assets'),
  },
  module: {
        rules: [
            {
                test: /\.scss$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'application.css',
                        }
                    },
                    {
                        loader: 'extract-loader'
                    },
                    {
                        loader: 'css-loader?-url'
                    },
                    {
                        loader: 'postcss-loader'
                    },
                    {
                        loader: 'sass-loader'
                    }
                ]
            }
        ]
    }
};

postcss.config.js

module.exports = {
  plugins: [
    require('autoprefixer')
  ]
}

And in the package.json I've set the following:

"browserslist": [
    "defaults"
  ],

I'm not seeing any prefixing being made, so I'm curious about what I'm doing wrong. Have I missed something?

Answer 1

Seems like this was working all along. I was just expecting the "defaults" setting to create more prefixes than it actually did. Changing the setting to "last 2 versions" gave me the expected output.