gulpfile.jsにAutoprefixerのブラウザオプションを書くとエラーがでる場合の修正方法

Autoprefixerのアップデートの影響で、gulpfile.jsにブラウザオプションを記述していると、下記のようなエラーが出るようになりました。

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

解消するためには、package.jsonにブラウザオプションを移動すればOKです。

ブラウザオプションの設定

今までgulpfile.jsに書いてあった設定をpackage.jsonや.browserslistrcに移動すればOKです。

gulpfile.js 修正前.pipe(postcss([
  autoprefixer({
    browsers: [
      'last 2 versions',
      'Explorer >= 11',
      'iOS >= 9.0',
      'Android >= 4.1']
  })
]))

browsers:[]内の設定を切り取ります。

gulpfile.js 修正後.pipe(postcss([
  autoprefixer()
]))

あとは下記の設定はpackage.jsonの}前にペーストします。

package.json"browserslist": [
  "last 2 versions",
  "Explorer 11"
  "iOS 9.0",
  "Android 4.1"
]

これで保存して、再度gulpを実行するとエラーが表示されなくなっているはずです。