2021年12月07日：注意这是一篇发布于2018年的老文章，因网友提到上篇文章有个链接失效的问题，故将当时写的文章迁移过来（文章之前存于上家公司的FE内部提交，离职已久，正好借机迁移，避免丢失，也算是终结这几篇PostCSS的学习笔记）。当然这么多年PostCSS发展迅猛，变化也很大，故这套教程也仅供参考），以下是原文内容：

图解PostCSS的插件执行顺序 文章其实是一系列的早就写完了. 才发现忘了发在SegmentFault上面, 最早发布于[链接] 这次我继续研究PostCSS的插件的执行顺序。 之前有研究过做过假设，在插件列表中，PostCSS的插件执行顺序自上而下，一切看起来似乎是没有任何问题的。 我也看过有关PostCSS解析器的相关文章，有以下一些收获...

习惯Webpack + PostCSS后, 通常PostCSS都是直接对CSS文件进行处理, 但是大部分习惯SCSS/SASS/LESS的朋友也许不适应了. 我专门研究了一下, 在Visual Studio Code编辑器下如果配置相关代码和设置达到CSS文件完美编写SCSS的办法, 其他语法类型原理相似, 这里以SCSS为例.

移动端采用Flexible将PX转换REM适配及开发中Retina屏1px边框的两种解决方案 说明：两个方案均基于Webpack构建。 方案一： 搭建环境及相关配置 webpack 3，需要loader及说明 css-loader, style-loader 加载css文件 expose-loader 暴露全局例如jquery url-loader 样式文件内的图片等资源 file-loader 字体等资源 使用库和...

题外话，其实我也很好奇，为什么postcss-px2rem没有被收录在PostCSS插件列表中，难道是因为收录者认为postcss-pxtorem可以取代它？不过两者各有利弊，就看开发者的喜好了。

这个就不用多说了，必装插件之一。方便的写规范的css，它会为你提供非常完整的hack兼容方案的。当然这里需要了解一下的是，它的大部分兼容数据来源Can I Use，另外一个稍微需要了解的插件配置参数就是browsers，比如这样写：

截至目前（2017年7月）PostCSS已经有超过200个插件，你可以插件列表查找有没有你所需要的插件。如果你想自己写个插件，据说这是一个不错的主意，而且非常简单（前提掌握node.js，不过我还没学会呢），你可以试着搞点事。