cannot find module styles.css with postcss

Question

I am following this example for a quick intro to postcss:

https://www.sitepoint.com/an-introduction-to-postcss/

After installing postcss and autoprefixer globally, creating a styles.css file in the root of my project and running the following command:

postcss -u autoprefixer styles.css -d public

I get the error:

Plugin Error: Cannot find module 'styles.css'

Why does it think it is is a plugin error?

Answer 1

Had the same issue & found this related post: Autoprefixer errors with NPM (✖ Plugin Error: Cannot find module )

The command I ran is

postcss styles.css -d dist -u autoprefixer

As the related answer shows, -u now takes multiple plugins so the order has to be modified.

Also if you use that tutorial, the example of "display: flex;" is no longer useful as it will work "as is" across browsers. Instead use

::placeholder {
  color: gray;
}

to test autoprefixer