Webstorm实现css3自动加前缀prefix

CSS3不同平台兼容性增加了很多代码，人工实现兼容费时费力又容易出错。
好在神器webstorm内置了css3自动补全。当输入transform时,webstorm
会自动补全如下，nice：）

-webkit-transform: ;
-moz-transform: ;
-ms-transform: ;
-o-transform: ;
transform: ;

但是当我们从别处复制来的或者只有原生的时怎么办呢？

autoprefixer

autoprefixer可以实现css3代码自动补全。

详情见，https://github.com/postcss/autoprefixer

webstorm整合autoprefixer

打开设置，搜索external tools，点击绿色+号，

配置如下

2015-04-20_144359.png

Program是autoprefixer 的PATH，windows下可以用

where autoprefixer

参数如下

Program:填入你的PATH，我的是C:\Users\Administrator\AppData\Roaming\npm\autoprefixer.cmd

Parameters:$FileDir$$FileName$

Working directory :$ProjectFileDir$

配置快捷键

keymap 搜索 external tool， 配置 autoprefixer即可。 我配置的是
CTRL+SHIFT+ALT+P。

下次就可以直接CTRL+SHIFT+ALT+P一键转换了