Replace Autoprefixer browsers option to Browserslist

[webdevnerdstuff]

Issue: We now need to replace the autoprefixer (as of V9) browsers options to use browsers list. How do we implement this and/or how do we integrate .browserslistrc with the options? Without changing it the console is giving a warning (see below). Outside of using an older version of autoprefixer, and/or if it's even possible with the current version of grunt-postcss.

Grunt post-css options: With the current example config I'm getting the following message below.

processors: [
  require('autoprefixer')({
    browsers: ['>1%'],
  }),
],

Command line warning output:

  Replace Autoprefixer browsers option to Browserslist config.
  Use browserslist key in package.json or .browserslistrc file.

  Using browsers option cause some error. Browserslist config
  can be used for Babel, Autoprefixer, postcss-normalize and other tools.

  If you really need to use option, rename it to overrideBrowserslist.

  Learn more at:
  https://github.com/browserslist/browserslist#readme
  https://twitter.com/browserslist

[webdevnerdstuff]

As of at least autoprefixer version 9.1.5 it does not show this message. When I was getting the error earlier it was with version 9.7.0.

[C-Lodder]

@webdevnerdstuff https://github.com/C-Lodder/grunt-postcss/issues/14

[webdevnerdstuff]

I had tried both methods described in that other issue, but nothing was getting auto-prefixed. I guess I'll have to revisit it again some more to see where/if I went wrong. But for now I'll most likely be sticking with the older version and circle back when I have more time to experiment.

Perhaps you could update the docs with the info from the other ticket? That might be helpful for others who are able to get it to work. Thank you.

[C-Lodder]

If you want to provide a link to the repo you're working on, maybe I can have a look and see what you're currently doing and fix it?

[webdevnerdstuff]

It's a private repo with the company I work at, so I'm not allowed to give access. It's a fairly complicated setup as well. I'll try testing things out with a bare bones test next time to see if I can figure it out when I have more time to experiement. If I can, then hopefully I can transfer that over to the project. If I cannot, then I may take you up on that offer.

Thank you for the offer though, I really do appreciate it. :)

[pantaluna]

I use this and that seem to work.

                processors: [
                    require('pixrem')(), // Add fallbacks for rem units
                    require('autoprefixer')({overrideBrowserslist: ['last 2 versions']}) // 9.7.1: use overrideBrowserslist // Add vendor prefixes for the last x versions
                ]