Autoprefixer是一个后处理程序，不象Sass以及Stylus之类的预处理器。它适用于普通的CSS，可以实现css3代码自动补全。也可以轻松跟Sass，LESS及Stylus集成，在CSS编译前或编译后运行。
css 代码:

a {
-webkit-border-radius : 5px;
border-radius : 5px
}

编译成css代码：

a {
border-radius : 5px
}

因为经过Autoprefixer处理，CSS将仅包含实际的浏览器前缀。

AutoPrefixer是一个强大的后处理程序，它允许开发者编写普通的CSS代码，而不需要担心为不同浏览器添加特定的前缀。这个工具使用Can I Use网站的数据来决定哪些CSS属性需要添加前缀，以确保跨浏览器的兼容性。AutoPrefixer可以与Sass、Stylus或LESS等预处理器一起使用，也可以单独用于普通的CSS文件。它的主要优势在于自动化处理前缀问题，减少开发者的工作量，并保持代码的整洁和一致性。

如何使用AutoPrefixer

AutoPrefixer的使用非常简便。它可以通过插件的形式集成到多种IDE（如Sublime、Brackets或Atom）中，但在WebStorm中需要通过External Tools或File Watchers来实现。此外，AutoPrefixer也可以与现有的打包工具（如gulp和webpack）一同使用，自动为项目中所有的CSS文件中的属性添加前缀。

• 在gulp中使用：可以通过结合postcss和autoprefixer插件，或者使用gulp-autoprefixer插件来实现。
• 在webpack中使用：首先安装autoprefixer和postcss-loader，然后在webpack.config.js中配置postcss-loader和autoprefixer。

Vue CLI中的AutoPrefixer配置

对于使用vue-cli构建的项目，autoprefixer的配置已经预设好了，开发者无需进行额外的配置。如果需要自定义配置，可以通过修改.postcssrc.js和.browserslistrc文件来实现。

AutoPrefixer的优势

AutoPrefixer的主要优势在于其自动化处理前缀的能力，它根据Can I Use网站的数据来决定哪些前缀是必需的，从而确保CSS代码的跨浏览器兼容性。这不仅减少了开发者的工作量，还避免了因手动添加前缀而可能出现的错误和遗漏。

总之，AutoPrefixer是前端开发中不可或缺的工具之一，它通过自动化处理CSS前缀问题，极大地提高了开发效率和代码质量。

可能遇到的错误

vue2 报错 Error: PostCSS plugin autoprefixer requires PostCSS 8