webstorm scss 自动编译添加css3前缀

sass或者scss编译为css时，webstorm配置如下：（http://www.cnblogs.com/phoenix-smile/p/5063216.html）如果没有安装ruby则先安装，下载地址：http://rubyinstaller.org/downloads安装注意：1.安装ruby，此步骤只需留意勾选Add Ruby executables to your PATH这个选项，它将添加环境变量，不然以后使用编译软件的时候会提示找不到ruby环境，影响Webstorm 自动编译。2.安装后，在开始菜单找到Start Command Prompt with Ruby3.安装scss   命令为：gem install sass4.安装Autoprefixer，是不是全局安装（-g）那就看你自己的环境了   命令为：npm install autoprefixer -g5.安装postcss-cli，Autoprefixer其实是postcss的插件        命令为：npm install postcss-cli -g6.配置webstorm-autoprefixer  打开Webstorm设置，File  -> settings  -> Tools -> File Watcher ;点击新增按钮7.修改Arguments，默认输出到scss文件同目录，建议修改到其他位置，（7.1或7.2任选）  7.1修改到上一级的stylesheets目录下    修改前--no-cache --update $FileName$:$FileNameWithoutExtension$.css    修改后--no-cache --update $FileName$:$FileParentDir$\stylesheets\$FileNameWithoutExtension$.css  7.2修改到指定css目录下，从项目根目录开始找    修改前 Arguments:--no-cache --update $FileName$:$FileNameWithoutExtension$.css          Output paths to refresh:$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map    修改后（本项目） Arguments:--style expanded --no-cache --update $FileName$:$ProjectFileDir$/webAppModal/assets/style/css/$FileNameWithoutExtension$.css          Output paths to refresh:$ProjectFileDir$/webAppModal/assets/style/css/$FileNameWithoutExtension$.css:$ProjectFileDir$/webAppModal/assets/style/css/$FileNameWithoutExtension$.css.map
8.配置autoprefixerFile->Tools->External Tools 点击addName:Autoprefixerdescription:AutoprefixerProgram:C:\Program Files\nodejs\node_global\postcss.cmdParameters:-u autoprefixer -o $FileDir$/$FileName$  $FileDir$/$FileName$Working directory:$ProjectFileDir$其余默认不变

参考链接：http://jingyan.baidu.com/article/3c343ff7e0a39d0d3779633c.html