一、简介
postcss 是一个利用JS插件来对CSS进行转换的工具，这些插件非常强大，强大到无所不能，具有以下功能：
- 拥有极高的处理性能（3倍以上的处理速度）
- 既可以写正常的CSS，也可以结合LESS或者SASS一起编写
- 对Source Map支持更好
二、postcss 的一些不错的插件
- autoprefixer是一个后处理程序，适用于普通的CSS，可以实现css3代码自动补全，也可以轻松跟Sass，LESS及Stylus集成，在CSS编译前或编译后运行。
- postcss-cssnext (内置autoprefixer) 允许你使用未来的css语法，如css4（可以理解为css中的Babel）
- postcss-sprites 自动制作雪碧图，不用手动拼接啦
- cssnano 压缩css代码(如果你是用webpack的话，css-loader集成了cssnano，你不需要再次引入)
- postcss-hash-classname 把转换后的css文件名附上哈希值
- pixrem 将rem转换为px
- postcss-px-to-viewport 将px转换为vh和vw（推荐作为移动端的计量单位，而不是rem）
- postcss-pxtorem 将px转换为rem
三、postcss.config.js的作用和配置
postcss.config.js 为 postcss 插件的配置文件。
const autoprefixer = require('autoprefixer')
module.exports = {
plugins: [
autoprefixer()
]
}
上文配置中，就引入了 autoprefixer 插件。
评论