とある案件で、webpack + AutoPrefixer を使ってて、
CSS の出力結果から display: -webkit-flex; とかが何故か抜けててしまってて、
Android4 系とかの一部端末で横並びが効いてない事があったので、その時の実装メモ。

AutoPrefixer のドキュメントに記載がありましたが、
原因は、webpack とかのビルドツールにも AutoPrefixer が含まれていて、
そのツールを使って AutoPrefixer を使うとそのツールの
デフォルトのブラウザリストを使うので、
結果的にプレフィックスを削除するよ、的な事のようでした。

AutoPrefixer のブラウザリストの設定は、
browserslist のファイルをルートに置くか、
package.json の key に browserslist を設定する事が推奨されているようなので、
package.json に設定を移す事で無事に解決できました。

webpack2 + React で CSS モジュールを構築した時も同じ問題に直面したりして、
webpack.config.js や gulpfile.js などに記載していた AutoPrefixer の Browserlist を、
こちらのpackage.jsonのように記載して解消されました。