webstorm使用Autoprefixer

Autoprefixer 是处理浏览器前缀的后处理程序，可以实现css3代码自动补全前缀

实现步骤

1. 安装 node.js

下载node

2. 安装autoprefixer

在终端输入：

npm install autoprefixer -g

3. 安装postcss-cli

npm install postcss-cli -g

4. 配置External Tools

打开Webstorm设置，Preferences -> Tools -> External Tools ;点击新增按钮，如图：

配置如下：

Program: 填入你的postcss-cli 的PATH(我是 mac)；
Parameters: -u autoprefixer -o $FileDir$/$FileName$ $FileDir$/$FileName$
Working directory : $ProjectFileDir$

5. 设置快捷键

现在在你的 webStrom 打开 css 文件按shift+a 看看会发生什么神奇的事情吧😄