webstorm 添加css前缀（兼容）自动添加

Webstorm自动添加css前缀（ 兼容)

百度了不少在webstorm中添加css前缀（兼容）自动添加，autoprefixer插件是首选，对于基本的css,还有less都支持，因此就选择了autoprefixer插件做为css前缀自动添加插件。

经过百度，发现有不少介绍此插件在webstorm的使用，但经过测试，虽说没有问题，可是都没有介绍一个关键的点，因此致使我在测试的时候都发现没有改变，现将其详细步骤介绍以下：

1.安装node

2.安装Autoprefixer 

npm install autoprefixer -g

3.安装postcss-cli  

npm install postcss-cli -g

4.在webstorm中依次点击File-->Settings-->Tools-->External Tools

Program:C:\Users\Administrator\AppData\Roaming\npm\postcss.cmd        (根据本身电脑路径)

Arguments:-u autoprefixer -o $FileDir$\$FileName$ $FileDir$\$FileName$

5.在css，less文件中右键

点击就会出现

6.这样点击有点麻烦，直接设置快捷键：

这样完成后，直接按住Shift+A就能够实现css前缀自动补全