我们相信:世界是美好的,你是我也是。平行空间的世界里面,不同版本的生活也在继续...

书接上文,正常情况下来说,webstorm设置的uglifyjs的watcher的结果,是由多少个.js文件,就由多少个.min.js文件。这个效果,和苏南大叔的预期值稍稍有些不一样。那么在本文中,苏南大叔,继续修改webstorm,使得最终只有一个.min.js文件。当然,最正确的途径是使用webpack,这个是后话。

苏南大叔:webstorm如何设置uglifyjs合并多个js文件并压缩 - webstorm-uglifyjs
webstorm如何设置uglifyjs合并多个js文件并压缩(图3-1)

本文中,苏南大叔还继续修改webstormuglifyjsfile watcher

新建命令行文件

在根目录下面建立了一个build.cmd文件。里面的内容如下:

cd src
uglifyjs 1.js 2.js 3.js -o ../dist/all.min.js

如果您要调整js的顺序或者数量,直接修改这个cmd文件即可。

如果您的操作系统是mac的话,上述命令可能存在需要注意的地方是:

  • 名称为build.sh,即后缀名不同。
  • cd里面的路径可能需要写:相对根目录绝对路径。
  • 可能需要给这个sh文件执行+x的权限。否则将会有“不能执行,也不报错”的情况发生。
sudo chmod +x build.sh

修改file watcher的program path

把默认的uglifyjs的路径,设置为项目根目录下面的build.cmd或者build.sh文件即可。

苏南大叔:webstorm如何设置uglifyjs合并多个js文件并压缩 - 343
webstorm如何设置uglifyjs合并多个js文件并压缩(图3-2)

苏南大叔:webstorm如何设置uglifyjs合并多个js文件并压缩 - 344
webstorm如何设置uglifyjs合并多个js文件并压缩(图3-3)

最终效果

修改src/目录下面的.js文件,就会触发生成dist/all.min.js文件。watcher中的参数一项随便填即可,注意refresh的路径,一定要填写正确,填写dist/目录的地址。

结论

如果把file watcherprogram path,可以设置为某个cmd命令的话,那么可以做文章的地方,毕竟就多了。大家思路发散发散就可以想出更多的应用场景。

更多uglifyjs的相关经验文章,请参见苏南大叔的文章。

助理微信

微信打赏码

微信公众号

微信小程序

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留作者链接。

 【福利】 腾讯云最新爆款活动!1核2G云服务器首年50元!

 【源码】本文代码片段及相关软件,请点此获取更多信息

 【绝密】秘籍文章入口,仅传授于有缘之人   webstorm    uglifyjs