postcss越來越重要了，經常可以看到它的身影，比如面試，論壇。本篇文章是小編參考多方資料以及官網總結出來的，不喜勿噴，喜歡多多支持，謝謝！
另外 React Redux ES6 Webpack...... 更多幹貨在個人主頁中查看
什麼是postcss
postcss 一種對css編譯的工具，類似babel對js的處理，常見的功能如：
1 . 使用下一代css語法
2 . 自動補全瀏覽器前綴
3 . 自動把px代為轉換成rem（rem不熟悉的， ）
4 . css 代碼壓縮等等
postcss 只是一個工具，本身不會對css一頓操作，它通過插件實現功能，autoprefixer 就是其一。
與 less sass 的區別
less sass 是預處理器，用來支持擴充css語法。
postcss 既不是 預處理器也不是 後處理器，其功能比較廣泛，而且重要的一點是，postcss可以和less/sass結合使用
關於取捨
雖然可以結合less/sass使用，但是它們還是有很多重複功能，用其中一個基本就 ok 了。
以下是個人的總結：
postcss 鼓勵開發者使用規範的CSS原生語法編寫源代碼，支持未來的css語法，就像babel支持ES6。
less、sass 擴展了原生的東西，它把css作為一個子集，但這不好保持向後兼容。
總體來說區別不大，看個人喜好吧
如何使用
這裡只說在webpack裡集成使用，首先需要 loader
1 . 安裝
npm install postcss-loader –save-dev
2 . webpack配置
一般與其他loader配合使用，下面*標部分才是postcss用到的
配合時注意loader的順序（從下面開始加載）
3 . postcss配置
項目根目錄新建 postcss.config.js文件，裡面配置一些插件
注：也可以在webpack中配置
常用的postcss插件
1 . Autoprefixer
前綴補全，全自動的，無需多說
安裝：
cnpm install Autoprefixer --save-dev
2 . postcss-cssnext
使用下個版本的css語法【關於語法另一篇文章會單獨講】
安裝：
cnpm install postcss-cssnext --save-dev
3 . postcss-pxtorem
把px轉換成rem
安裝：
cnpm install postcss-pxtorem --save-dev
配置項：
特殊技巧:不轉換成rem
px檢測區分大小寫，也就是說Px/PX/pX不會被轉換，可以用這個方式避免轉換成rem
下篇：cssnext，下一代css
【關注一下不迷路】
html css html css javascript html javascript css javascript css
閱讀更多 全棧前端 的文章
