2021年12月07日：留神这是一篇公布于2018年的老文章，因网友提到上篇文章有个链接生效的问题，故将过后写的文章迁徙过去（文章之前存于上家公司的FE外部提交，到职已久，正好借机迁徙，防止失落，也算是终结这几篇PostCSS的学习笔记）。当然这么多年PostCSS倒退迅猛，变动也很大，故这套教程也仅供参考），以下是原文内容：
几个月前写了几篇对于PostCSS的文章，波及到根本配置钻研和插件的摸索，起初还有几份不成文的草稿，因为本身技术钻研不够深刻也就始终没有写完，也不打算更新了（放在文章底部，有趣味本人看看：）。起初正巧有集体在GitHub下面提了个issue对于postcss-px-to-viewport插件的应用postcss-px-to-viewport插件的应用，也就尝试用了新单位vw来做挪动端的适配策略。以下便是PostCSS最初的内容了。
PostCSS挪动端适配值VW单位利用
之前的番外篇一曾经写了px转为rem的相当成熟的形式了。这次要介绍PostCSS另一个使用VW单位来进行适配的计划。
基于之前的PostCSS配置，装置postcss-px-to-viewport插件，貌似是目前惟一一个能够转换成viewport单位的PostCSS插件。
这个插件跟之前的postcss-pxtorem插件比拟相似，配置办法见官网阐明这里就不多说了，当然还是要用到amfe-flexible，其实新单位的对旧的手机零碎和浏览器来说必定还是不适合的，目前也没有一个精确的数据来证实这个不会呈现兼容性问题。
当然，将来趋势来看，用这个在不同分辨率的设施适配上的劣势还是比拟大的，能够参考我的GitHub的一个挪动端DEMO。
PS：其实我始终都很不适应之前设计稿750px，测量了设计稿的尺寸后，还须要手动除以2，这个齐全能够通过配置来间接写原始尺寸的？不过就我集体来看，我还是偏向采纳rem单位，或者更加稳固吧！
如果还有疑难，欢送留言，对于PostCSS的所有内容就算完结了，也心愿其余敌人们在应用中一起学习探讨:D
【草稿】PostCSS学习指南-插件（三）
postcss-sorting
这是一款可能按主动帮忙你的css属性进行规范化排序的一个小插件，对于有整洁代码强迫症的敌人来说，这个插件存在的意义就比拟大了。
https://github.com/hudochenko...
相似的另一个插件：css-declaration-sorter
其余：
postcss-pxtorem对px进行疏忽解决的形式仿佛更好
postcss-px2rem却没有被收录在PostCSS的列表中
https://github.com/anandthakk... 一个本地应用的caniuse我的项目
【草稿】PostCSS学习指南（三）【栅格化布局】
参考文献
你的布局设定办法靠谱吗？
A Complete Guide to Grid
bootstrap4 Grid system & bootstrap3文档栅格零碎
The CSS Grid Challenge: Build A Template, Win Some Smashing Prizes!（开端有大量干货）
浏览bootstrap4栅格化官网阐明的一点心得
不瞒大家，我之前并未在我的项目中应用过bootstrap，也只是晓得这个货色和他的UI的一些标准而已。这次有幸理解到bootstrap栅格化的计划，尤为惊喜，竟然有这么好的适配办法！不愧是弱小的响应式布局CSS框架啊！！！
如果大家相熟bootstrap栅格化的形式，可略过此内容。
后记随想（2021年12月07日）
当年写这几篇文章的时候热血沸腾，连SCSS、LESS都没搞得很明确的状况下，一门心思想钻研PostCSS，过后国内没有一本书籍介绍PostCSS（可能有一本，有点想不起来了），还想着我要出一本书，最终还是因为精力有限，没有去进一步深究，说到底也是Javascript根底尚不扎实，再加上本人常常三分热度做事。
不过话说回来，依据集体教训，兴许和工作环境无关，起初的很多开发中，除了挪动端或者会用到PostCSS，简直没有再用了。然而现在我十分喜爱的TailwindCSS、PurgeCSS这些都和PostCSS有肯定关系，对于前端将来的倒退，我仍然感觉PostCSS是十分不错的玩意。除了我的这套文章有些掉队，也还是十分反对大家去学习去钻研PostCSS的~
如果想要从头看，请浏览2017年公布的PostCSS自学笔记（一）【装置应用篇】