我也是從網上學習然后結合自己的安裝使用經驗來寫的,
一 : JetBrains WebStorm 2016.3.3的安裝使用(我的設置是基於2016.3.3這個版本來講的)
1,安裝nodejs
必須要有nodejs,這個是必須也是首要條件,下載地址:https://nodejs.org/en/ ;默認是安裝在C:\Program Files\nodejs下面，（根據個人需要），最新版的nodejs已經集成了npm，所以不需要再安裝npm包。
2、安裝autoprefixer
在命令行中輸入：npm install autoprefixer -g；使用npm管理工具全局（-g）安裝autoprefixer。
3、安裝postcss-cli（Autoprefixer其實是postcss的插件）
在命令行中輸入：npm install postcss-cli -g；
4、配置External Tools
在webstorm中打開設置,file—Settings-tools-External Tools,(或者打開設置然后搜索"External Tools");點擊新增按鈕；
名字(name)隨便你填(自定義)
Program:填入你的postcss.cmd 的路徑；
Parameters: -u autoprefixer -o $FileDir$/$FileName$ $FileDir$/$FileName$ ; (你可以根據你自己的需要配置，具體參見https://github.com/code42day/postcss-cli)
Working directory :$ProjectFileDir$ ;
例如我的配置是:
Program:C:\Users\Administrator\AppData\Roaming\npm\postcss.cmd；(這里填的是你的"postcss.cmd"路徑)
Parameters: -u autoprefixer -o $FileDir$/$FileName$ $FileDir$/$FileName$ ，你可以根據你自己的需要配置，具體參見https://github.com/code42day/postcss-cli
Working directory :$ProjectFileDir$
4,使用
安裝設置好后,就可以在你css文件右鍵然后選擇External Tools,然后選擇你之前隨便填的名字,
6,設置快捷鍵
如果覺得麻煩,可以自己設置快捷鍵,打開Webstorm設置，Preferences -> Keymap ， 搜索External Tools ， 配置 autoprefixer即可。 不要和原來的沖突就可以了。
二 : Hbuilder的安裝與使用
首先和前面一樣
1,安裝nodejs
必須要有nodejs,這個是必須也是首要條件,下載地址:https://nodejs.org/en/ ;默認是安裝在C:\Program Files\nodejs下面，（根據個人需要），最新版的nodejs已經集成了npm，所以不需要再安裝npm包。
2、安裝autoprefixer
在命令行中輸入：npm install autoprefixer -g；使用npm管理工具全局（-g）安裝autoprefixer。
3、安裝postcss-cli（Autoprefixer其實是postcss的插件）
在命令行中輸入：npm install postcss-cli -g；
4,設置
打開HBuilder，運行-外部工具-外部工具配置，設置
要執行的命令或文件 : 填寫npm安裝目錄\postcss.cmd
工作目錄 填寫${project_loc}
參數 填寫-u autoprefixer -o ${resource_loc} ${resource_loc}
例如我的:
要執行的命令或文件 : C:\Users\Administrator\AppData\Roaming\npm\postcss.cmd
工作目錄 : ${project_loc}
參數 : -u autoprefixer -o ${resource_loc} ${resource_loc}
具體設置如下圖：
設置好后,點擊運行,頭一起可能會出錯,重啟Hbuilder或者電腦就解決了
5使用:
同樣的道理,在css文件中右鍵,然后選擇外部工具,然后選擇autoprefixer,等編譯完成就行了,
6,配置快捷鍵
工具-選項-常規-快捷鍵，搜索autoprefixer（此處為你新建外部工具的名稱），設置快捷鍵即可