Autoprefixer介绍及在Vue中应用

1、介绍
Autoprefixer是一款自动管理浏览器前缀的插件，可以解析css文件并且添加前缀到css内容里，使用Can I Use(caniuse网站)的数据决定哪些前缀是需要的。该插件css解析器采用postcss，使用Browserslist库，可以对浏览器的版本做精确设置。
2、工具特点
（1）、写纯净的css，不必学习特殊语言（如Sass），也不必记住其使用环境；
（2）、与最新的规则同步；
3、在Vue中使用
（1）、安装postcss和autoprefixer
npm install postcss
npm install autoprefixer
（2）、在"项目名/build/webpack.base.conf.js "中加入
const autoprefixer=require("autoprefixer")

module:{
  rules:[
    {
      test:/\.vue$/,
      loader: 'vue-loader',
      options:{
        vueLoaderConfig,
        postcss:[require('autoprefixer')({ browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie> 8'] })]
      }
    },
（3）、在package.json里面找到 browserslist，加入以下内容，以兼容主流机型
"browserList":[
  "> 1%",
  "Last 2 versions",
  "not ie <= 8",
  "iOS >= 8",
  "Firefox >= 20",
  "Android > 4.4"
]