title: Migrating postcss-loader from 3.0.0 to 4.0.2 results in Error: [object Object] is not a PostCSS plugin
body: <p>So Today I have been trying to migrate postscss-loader from version 3.0.0 to 4.0.2</p>
  <p>I noticed since verion 4.0.0 they added postCSS as a peer dependency so I've added postcss version 7.0.27. I did not go for 8 as I also use 'postcss-import' and this relies on version 7.
  This should be okay as postcss-loader can both use version 7 and 8.</p>
  <p>However now when running I get the same error message for al of scss files:</p>
  <p><code>Error: [object Object] is not a PostCSS plugin</code></p>
  <p>As the message is not really descriptive, solving the issue has become a real trial and error method. With no success so far.</p>
  <p>Here is my webpack.config.ts:</p>
  <pre class="lang-js prettyprint-override"><code>import postCSSImport from 'postcss-import';
  import autoPrefixerFlexbox from 'postcss-flexbugs-fixes';
  import autoPrefixer from 'autoprefixer';
  
  const BrowserList = {
      mobile: ['android &gt;= 4', 'ios &gt;= 8'],
      desktop: ['firefox &gt;= 40', 'chrome &gt;= 49', 'edge &gt;= 12', 'opera &gt;= 47', 'ie &gt;= 11', 'safari &gt;= 9'],
      designer: ['firefox &gt;= 40', 'chrome &gt;= 49', 'edge &gt;= 12', 'opera &gt;= 47', 'ie &gt;= 11', 'safari &gt;= 9'],
      translation: 'last 1 chrome versions'
  };
  
  module.exports = async (env, argv) =&gt; {
  
      const webpackConfigs = [];
   
      webpackConfigs.push({   
          module: {
              exprContextCritical: false,
              rules: [
                  { // babel javascript/typescript (no type checking), also see ./babel.config.js
                      test: /\.(js|jsx|ts|tsx)$/,
                      exclude: /node_modules\/(?!@k2g)/, 
                      use: {
                          loader: 'babel-loader',
                          options: {
                              presets: [
                                  ['@babel/preset-env', {
                                      targets: {
                                          browsers: BrowserList[target]
                                      }
                                  }]
                              ]
                          }
                      }
                  },
  
                  { // sass
                      test: /\.(scss|sass)$/,
                      exclude: /node_modules\/(?!sweetalert2)/, 
                      use: [
                          { loader: 'style-loader' }
                      ),
                      {
                          loader: 'css-loader',
                          options: {
                              importLoaders: 1
                          }
                      },
                      {
                          loader: 'postcss-loader',
                          options: {
                              sourceMap: false,
                              postcssOptions: {
                                  plugins: [
                                      postCSSImport(), // for @import in css
                                      autoPrefixerFlexbox,
                                      autoPrefixer({
                                          overrideBrowserslist: BrowserList[target], // target = 'desktop' 
                                          grid: true
                                      })
                                  ]
                              }
                          }
                      },
                      {
                          loader: 'sass-loader',
                          options: {
                              additionalData: vars.sass, // e.g. '$url-logo: &quot;/resources/images/logo.png&quot;;'
                              sourceMap: true,
                              sassOptions: {
                                  outputStyle: 'expanded',
                                  sourceMapContents: true
                              }
                          }
                      }
                  ] 
              },
          }
      })
  }
  </code></pre>
  <p>I tried several things in the options of the postcss-loader:</p>
  <ul>
  <li>setting execute to true</li>
  <li>setting sourceMap to true</li>
  <li>setting both to false</li>
  </ul>
  <p>To be complete here are the versions of dependencies I use:</p>
  <pre><code>Node:       v12.16.1
  Webpack:    4.44.1 
  Yarn:       1.22.5 
  postcss:    7.0.27
  css-loader: 3.6.0
  </code></pre>
  <p>Do you see the problem here or know where to look?
  It would be a help.</p>
  <p>Thanks in advance</p>