webstorm或phpstorm配置CSS或JS压缩

webstorm或phpstorm配置YUI Compressor CSS 或  YUI Compressor JS压缩

1，准备材料

Webstorm或phpstorm

 

Yuicompressor.jar  

地址：http://download.youkuaiyun.com/download/w123456h19/5624633

 

安装java         

直接下载地址 https://www.java.com/zh_CN/

（有兴趣的话顺便把环境变量给配了，以后可能其他地方能用到

相关教程：http://jingyan.baidu.com/article/f96699bb8b38e0894e3c1bef.html）

 

 

 

2，安装过程

1,打开phpstorm(或webstorm)右上角的file -> settings -> Tools -> File Watchers 选项 -> 点击右侧的 “+” 按钮

 

 

 

 

 

2，选择 YUI Compressor CSS 或  YUI Compressor JS（本次图片以js压缩为例）

 

 

3，此处有3个必填选项，分别是 Program, Arguments和Output paths to refresh

其中 program 填写 javaw.exe 的路径，一般放在java安装路径的jdk1.8.0_121\jre\bin路径中（“jdk1.8.0_121”中的数字是java的版本号）；

例：C:\Program Files\Java\jdk1.8.0_121\jre\bin\javaw.exe

 

Arguments 填写 yuicompressor.Jar的路径以及 输出文件的格式

 

例：

JS压缩

 -jar G:\npm\yuicompressor-2.4.8.jar $FileName$ -o $FileNameWithoutExtension$.min.js

CSS压缩

-jar G:\npm\yuicompressor-2.4.8.jar $FileName$ -o $FileNameWithoutExtension$.min.css

 

 

Output paths to refresh填写刷新输出路径

JS压缩

$FileNameWithoutExtension$.min.js

CSS压缩

$FileNameWithoutExtension$.min.css

 

 

 

补充：低版本的webstorm或PHPstorm可能还需要填写  “Working directory”选项，直接指向当前路径就好了

例： $FileDir$

 

 

配置完成，尝试改变下js文件或css文件内容，若有新的min.js生成或min.css生成就证明配置成功啦~！