はじめてPostCSSを
使ってみたのでまとめてみました。

PostCSSとは

Node.js制の、
CSSツールを作るためのフレームワークです。

PostCSS自体はただのパーサーであり、
CSSを受け取り、パースしてARTを生成するという役割を果たしています。

PostCSSを使うメリット

ビルドして～してを、
PostCSSのエコシステムで全て解決できます。

Custom Syntaxesという機能を用いることで、
自分の欲しい機能だけカスタマイズすることができます。
このカスタマイズこそがPostCSSの最大の特徴であると
私自身は感じています。
下記でプラグインごとの書き方を少しご紹介します

ビルドツールはgulpを使用しています。
Node.js v8.11.2
gulp v3.9.1

postcss-importをインストールすると、
冗長なCSSファイルを複数に分割し
それぞれ読み込むことができるようになります。

下記では、color-cssとbtn-cssというファイルを
style.cssでimportしています。

style.css

Sassを普段から使用しているので
非常にとっつきやすかったです☺

プラグインの選定は下記からもできそうです。
自分にあったプラグイン選定にお役立てください