mac下使用Webstorm工具代码压缩

（先废话....可略过嘿嘿😑）

前端的JS/CSS/HTML的压缩会对于网页的加载起到加速的作用，由于现在使用移动设备的人越来越多，打开页面的速度和省流量成了开发必做的一项功课，当然提高加载速度和省流量有很多方面下面我介绍一种使用编辑器进行代码压缩。

现在前端构建工具很火热比如有Fis3（百度）、gulp、使用VUE的还有vue自己的构建工具，总之有很多，但是就我自己而言有时候觉得没有必要写完一个简单的页面也去构建一次觉得有点麻烦.....所以我就想能不能在我使用编辑器的时候自动编写编译开发上线也不影响呢？

经过各种百度、谷歌总算发现MAC的压缩插件就是来自雅虎的YUI Compressor，它是JS/CSS压缩工具，是采用java语言编写的工具，可以使用命令行的形式操作：

类似于：java-jaryui.jar--typecss--charsetutf-8-odest.csssrc.css

但是这样每次写完都去输入一遍，太麻烦还不如构建。

还好“伟大”的jetbrains 编辑器里有强大的File Watchers功能（据说是所有的IDE系列都支持）

步骤如下：

在settings->File Watchers里设置。（File Watchers是一个可以按照文件类型实时监测工程里的文件变化，并且提供回调接口的功能。）

以下以JS为例

第一步

如图：

选择工具首选项

第二步

如图：

选择添加

第三步

选择自定义

第四步

如图最关键步骤**

填写工具名称选择要要锁的文件选择你的插件路径填写参数和输出路径文件格式

上面的配置分别为:

1.下载好的jar 的路径（下载地址：https://github.com/yui/yuicompressor/releases）

2.$FileName$ -o $FileNameWithoutExtension$.min.js

3.$FileNameWithoutExtension$.min.js

最后点击OK 这时会提醒你是否重启webstrom，我选择了重启，实际测试重启不重启都可以。

其他的都不用管，直接编写CSS和JS然后选择command +s即可第一次使用需要保存一次，然后再编写就会自动保存

如图自动保存

下面会自动运行生成min.js

然后会得到如下结果

多么的神奇呀........

CSS文件的压缩跟上面的JS一样只要把参数和输出路径格式后缀改成CSS即可

我看到大神自己做了 HTML的压缩大家有兴趣可以点击参考文章去看看（我只是采用了自己需要的部分做了翻译嘿嘿）

参考文章：http://www.tuicool.com/articles/fQRrey