小tip：我是如何初体验uglifyjs压缩JS的

by zhangxinxu from http://www.zhangxinxu.com
本文地址：http://www.zhangxinxu.com/wordpress/?p=2946

1、故事总有其背景

年底将至，不少闲适的时间，因而刷刷微博，接触各类纷杂的信息——美其名曰“学习”。运气不错，遇到了一个新名词，uglifyjs. 听说是用来压缩JS文件的，听说还能优化JS,听说是基于node的，还听说比Google Closure Compiler更带感，哦？激起了个人好奇心。百之谷之，哟，相关的介绍还很多。而后折腾了个把小时，基本上知道了是个怎么回事。

我以为吧，仍是有些用的，即便是否是从事node开发的人，抽个小空，share之，因而就有了本文。人总有浮躁的时候，我也不例外，uglifyjs内部深刻的运做是如何的，唉，我是有气无力，不想去折腾，因此，本文更可能是停留在应用层面。不过嘛，这样反而受众面广一些。毕竟喜欢看《泰囧》的人要比《一代宗师》的多。

2、node相关的固定流程

凡事说起node应用，无非免不了相似下面的流程：

1. 安装node
2. 安装nmpnpm
3. 安装当前应用 – uglifyjs

前两个网上太多示意了，我以前也讲过，sorry, 我很懒。
uglifyjs安装以下code:

npm install uglify-js -g

一个回车，因而啪啪啪，就有下图所示的东东：

因而，下面就能够压缩JS了。

3、uglifyjs JS压缩

uglifyjs压缩有不少的参数，详见其github托管项目。其中有一些可选参数，以下部分截图：

什么美化压缩，空格多长，变量名是否变成短名字等……您有兴趣能够本身去看看，若是今天不是星期五，若是不是要赶回去买菜，我就会翻译下的——诸位，请原谅我吧，阿门！

下面演示如何使用uglifyjs压缩JS.

个人桌面上有个名叫formini的文件夹，我会把要压缩的文件放在其中，而后再压缩。如今，我从内部拷贝了一个名叫inet.js的JS文件到这个文件夹中，而后：

1. 打开cmd, 这个不会我就没有办法了
2. 目录引到formini文件夹，cd 而后什么什么的，这个不会我也没有办法了
3. 以下代码：

   uglifyjs inet.js -o inet-min.js

4. 再运行以下代码，测试-m可选参数：

   uglifyjs inet.js -m -o inet.min.js

   以下截图：
   

噢啦，如今就是看结果了，见下截图：

90K的是没有运行-m参数的，70K(69.4)的是运行的。-m参数因此就是把变量名变成a, b, c, d, ...

从实际应用角度讲，上线的JS显然要压缩变量，减少必定的文件尺寸。

跟YUICompressor相比，大小只小了0.6K, 不过网上反映uglifyjs相比YUI压缩很明显，我这里的大小仅优化了0.6÷174=0.345%，这只能说明我写的代码还算比较优化，哈哈（忽然想起了老婆的话，不要得瑟，深呼吸……深呼吸……）！

4、uglifyjs压缩批处理

咱们不可能每次都打开cmd去键入压缩执行代码，容易写错不说（如上面那个结果图），还耗时，想一想都会让人疯掉。懒人有懒法，花了点功夫，折腾了一个批处理文件，之后，想要压缩JS，只要双击运行这个.bat文件就能够了！完整代码以下：

@echo off
:: 设置压缩JS文件的根目录，脚本会自动按树层次查找和压缩全部的JS
SET JSFOLDER=C:\Users\Administrator\Desktop\formini
echo 正在查找JS文件
chdir /d %JSFOLDER%
for /r . %%a in (*.js) do (
    @echo 正在压缩 %%~a ...
    uglifyjs %%~fa  -m -o %%~fa
)
echo 完成!
pause & exit

新建一个txt文档，任意命名，将上面的代码粘贴进去，修改JSFOLDER后面的文件夹目录为你本身的，而后把.txt后缀改为.bat就能够啦！而后双击就能够批量使用uglifyjs压缩JS文件啦！

4、结束语

对于本身来说，本文内容算做备忘。目前而言，我仍是uglifyjs不能压缩CSS文件。不过嘛，了解下总会有帮助的。行文匆忙，文中要是有表述不许确的地方欢迎指正。

原创文章，转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址：http://www.zhangxinxu.com/wordpress/?p=2946

（本篇完）