autoprefixer: Error: [object Object] is not a PostCSS plugin

had Error: true is not a PostCSS plugin after upgrading to v10.

Then I read the changelog which mentions postcss being moved to peerDep

so I npm i postcssed and it went away

Same here:

TypeError: Invalid PostCSS Plugin found at: plugins[0]

(@/home/evan/Code/prepaid/web/postcss.config.js)
    at /home/evan/Code/prepaid/web/node_modules/.pnpm/postcss-load-config@2.1.0/node_modules/postcss-load-config/src/plugins.js:72:15
    at Array.forEach (<anonymous>)
    at plugins (/home/evan/Code/prepaid/web/node_modules/.pnpm/postcss-load-config@2.1.0/node_modules/postcss-load-config/src/plugins.js:58:13)
    at processResult (/home/evan/Code/prepaid/web/node_modules/.pnpm/postcss-load-config@2.1.0/node_modules/postcss-load-config/src/index.js:33:14)
    at /home/evan/Code/prepaid/web/node_modules/.pnpm/postcss-load-config@2.1.0/node_modules/postcss-load-config/src/index.js:94:14
    at async Promise.all (index 0)

My postcss.config.js:

/* eslint-env node */
module.exports = {
  plugins: [
    require('autoprefixer'),
    require('cssnano')({
      preset: ['advanced', {
        autoprefixer: false,
        discardComments: {
          removeAll: true
        }
      }]
    })
  ]
}

Same here. What a mess today in the world with CI/CD environments! 😄

@m4thieulavoie Yeap, Gulp users needs to wait before updating to PostCSS 8 plugins

Did you update to Autoprefixer 10? It do not work with old PostCSS 7 and require PostCSS 8.

Wait a little until postcss-cli and gulp-postcss was released.

npm install -D postcss fixed this issue for me using rollup + rollup-plugin-postcss

had Error: true is not a PostCSS plugin after upgrading to v10.

Then I read the changelog which mentions postcss being moved to peerDep

so I npm i postcssed and it went away

Not working for me. I use postcss through parcel-bundler and configured it via postcss.config.js and added postcss as a dev dependency.

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

which resolves in true is not a PostCSS plugin.

I think parcel has to act here - or autoprefixer respectively.

I added Known Issues section to PostCSS 8 changelog https://github.com/postcss/postcss/releases/tag/8.0.0

Same as above, but with a gulp task

gulp.task(
  'task-name',
  gulp.series(function () {
    return gulp
      [...]
      .pipe(
        postCSS([
          autoprefixer({
            browsersList: [
              'Chrome >= 35',
              'Firefox >= 38',
              'Edge >= 12',
              'Explorer >= 10',
              'iOS >= 8',
              'Safari >= 8',
              'Android 2.3',
              'Android >= 4',
              'Opera >= 12',
            ],
          }),
        ]),
      )
  }),
);

I also met the problem of: Error loading PostCSS config: Invalid PostCSS Plugin found: [1]. the [1] is the autoprefixer plugin. I am using vue2 and just css. I tried many versions and this configuration saved my day:

  "devDependencies": {
    "autoprefixer": "^9.1.0",
    "postcss": "^8.1.10",
    "postcss-import": "^13.0.0",
    "postcss-loader": "^4.1.0",
    "precss": "^4.0.0",
},
  "browserslist": [
    "last 2 versions",
    "> 1%",
    "iOS 7",
    "last 3 iOS versions"
  ]

and postcss.config.js:

module.exports = {
  plugins: [require("precss"), require("autoprefixer")]
};

and webpack:

 {
        test: /\.css$/,
        use: [
          { loader: "style-loader" },
          {
            loader: "css-loader",
            options: {
              importLoaders: 1,
              query: {
                autoprefixer: false
              }
            }
          },
          { loader: "postcss-loader" }
        ]
      }

hope that’s helpful.

@billyromano report an issue in gulp-postcss. 9.0 should support PostCSS 8 plugins.