#postcss-flexadapter

##Introduce 一款基于Postcss的gulp插件，用于兼容flexbox的所有新旧版本属性。编码时只需要使用最新的flexbox属性，之后通过该工具的转化会把对应flexbox属性的对应历史属性都补全，兼容各浏览器的呈现。注意，该插件只会对flexbox相关属性处理，其他属性一律不变。

例如，编码时（开发）：

display:flex;

插件处理后（发布）：

display: -webkit-inline-box;
display: -moz-inline-box;
display: -ms-inline-box;
display: inline-box;

同时，工具会自动去重，并且能够智能去掉前缀处理，例如：

-webkit-display:flexbox;
-ms-display:box;
display:flex;

这两个属性都是属于不同时期、不同浏览器前缀的兼容，在插件处理后将会被当作同一个属性处理，因此结果只会生成一样的：

display: -webkit-inline-box;
display: -moz-inline-box;
display: -ms-inline-box;
display: inline-box;

##QuickUse 可以拿test.css文件试试。

提供了Mac版绿色GUI客户端，基于Electron打包，即装即用不需要gulp命令行。

提供了PC版绿色GUI客户端，同上。

##Install 当然，你需要先安装gulp和gulp-postcss。

$ npm install --global gulp
$ npm install --save-dev gulp-postcss

然后安装插件。

//全局安装
$ npm install --global postcss-flexadapter

//局部安装
$ npm install --save-dev postcss-flexadapter

记得同时检查插件是否已经安装对应依赖，若没有请cd postcss-flexadapter，然后npm install其依赖。

##Usage

var postcss = require('postcss');
var flexadapter = require('postcss-flexadapter');

gulp.task('default', function() {
	var processors = [
		flexadapter
  	];
	gulp.src('test.css')
	    .pipe(postcss(flexadapter))
	    .pipe(gulp.dest('build/'));
});

##License MIT