Vue项目运行时出现Autoprefixer警告

3,764 阅读1分钟

今天运行项目的时候终端出现了很多Autoprefixer警告,看内容是说缺少了package.json key或者是缺少了 .browserslistrc 文件。

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

检查代码后发现是postcss.conf配置文件中的配置出现了问题,旧版配置是这样的

module.exports = {
  plugins: {
    'autoprefixer': {
      browsers: [
        "defaults",
        "ie >= 10",
        "last 2 versions",
        "> 0.2%",
        "iOS 7",
        "last 10 versions"
      ]
    }
}

查阅文档后发现是 autoprefixer 版本更新后,写法变更导致,文档地址:github.com/postcss/aut…

变更后需增加.browserslistrc文件,文件内容很简单:

# Browsers that we support

last 1 version
> 1%
maintained node versions
not dead

然后就可以愉快的去run了。

以上,记录。