I recently encountered this error in my Terminal when working with TailwindCSS and attempting to build my final CSS file.
Invalid PostCSS Plugin found at: plugins[1]
The plugin error was referring to AutoPrefixer. When I commented out Autoprefixer as a plugin in my postcss.config.js file and ran my build script again (postcss tailwind.css -o style.css
), the error was gone and the CSS file was built – but without AutoPrefixer.
The solution?
Downgrading Autoprefixer to version 9 did the trick.
So, in my package.json file – I downgraded autoprefixer to version 9.x.
Then, I just ran npm i
to downgrade the package.
You need to downgrade Autoprefixer to 9.x, since postcss-cli do not support PostCSS 8 pluginshttps://t.co/JMgJPYDKlA
— Sitnik the Developer (@sitnikcode) September 17, 2020
Disabling Autoprefixer could lead to bugs in old Safari
PostCSS 8
PostCSS was updated to version 8, however, PostCSS CLI has not yet been updated to handle PostCSS plugins which use the new PostCSS 8+ API. Autoprefixer uses the new PostCSS 8 API since version 10.
This is documented under known issues in the PostCSS GitHub page.
Once PostCSS CLI is updated to handle plugins that use the new PostCSS 8+ API, this will likely not be an issue. But until then, you may need to downgrade some PostCSS plugins to avoid errors.