在项目中小试CSS压缩合并工具
在现在公司的项目中, css的合并压缩都是由java程序员利用merge文件配置实现的, 我们前端干预不到. 但在自己做的一个较为独立的项目中, java程序员无法在服务器端提供这样一个功能, 所以只能我自己每次把页面交给他们之前将CSS合并压缩下. 已达到减少请求, 减小文件体积的目地. 由于之前一直手动进行的, 所以想找一个能和phpstorm集成的自动或半自动化一键合并压缩的工具.
在网上找了一些工具, 有的是需要php运行环境的, 有的则使用起来比较麻烦. 最后发现了Yabo(嗯, 就是鸭脖)这么一款工具, 功能刚好符合我的需求.
那么Yabo咋用呢? 且接着看:
1. 准备好css:
假设你的首页css分成了3部分: 01reset.css, 02common.css 和 04index.css. 那么此时你可以新建一个index.css, 然后利用import的方式把01, 02 和 04 引进去:
然后你在页面上真正要用的CSS才是index.css.
2. 在phpstorm中配置Yabo:
Setting -> External Tools –> Add
然后作如下配置,
接着在编辑器中右键选择yabo,
此时就会自动生成01reset.css, 02common.css 和 04index.css合并压缩后的index.min.css文件.
可能出现的问题
我在配置Yabo的过程出现了下面这个问题,
股沟了下说是js文件的默认打开方式没有了. 解决办法如下:
打开注册表编辑器，定位"HKEY_CLASSES_ROOT" > ".js" 这一项，双击默认值将数值数据改为"JSFile"即可，具体如下图：
