Node.js环境下使用UglifyJS压缩JavaScript代码的完整指南

UglifyJS压缩JavaScript代码基础教程

build.js脚本通过调用UglifyJS提供的接口函数来执行代码压缩任务。

获取与配置UglifyJS源码

第一步，从GitHub获取最新版本的UglifyJS。若已安装Git，可通过控制台执行以下命令进行克隆：

git clone git://github.com/mishoo/UglifyJS.git

或者，也可以通过HTTP方式下载ZIP压缩包。解压后，项目目录结构如下所示：

第二步，创建一个新的项目文件夹（例如myApp），并将uglify-js.js文件及lib目录复制到该项目中，目录结构参考如下：

编写压缩脚本compress.js

第三步，在myApp目录下新建一个名为compress.js的文件，其内容如下所示：

 
var fs = require('fs');
var jsp = require("./uglify-js").parser;
var pro = require("./uglify-js").uglify;
var origCode = "var abc = function(){ var one = 5; return one;}";
var ast = jsp.parse(origCode); // 解析代码并获取初始抽象语法树（AST）
ast = pro.ast_mangle(ast); // 生成包含混淆后变量名的新AST
ast = pro.ast_squeeze(ast); // 生成经过压缩优化的AST
var finalCode = pro.gen_code(ast); // 此处为压缩后的代码
console.log(finalCode);

上述代码首先引入Node.js的文件系统模块fs，随后加载UglifyJS中的解析器（parser）和压缩器（uglify）模块。接下来的步骤展示了UglifyJS的标准压缩流程：解析源代码、混淆变量名、执行压缩优化，最后生成压缩后的代码字符串。

执行压缩与封装自动化函数

第四步，打开命令行工具，执行compress.js脚本。

控制台输出了压缩后的代码。好了，就这么简单。\n5，既然在node环境下，当然可以写一个函数直接读取源文件，压缩后输出到指定的目录。将以上代码封装到一个函数中，如下

 
// 读取一个文件，压缩之
function buildOne(flieIn, fileOut) {
var origCode = fs.readFileSync(flieIn, 'utf8');
var ast = jsp.parse(origCode);
ast = pro.ast_mangle(ast);
ast = pro.ast_squeeze(ast);
var finalCode = pro.gen_code(ast);
fs.writeFileSync(fileOut, finalCode, 'utf8');
} 

例如，将我编写的ajax-1.0.js文件进行压缩，并将结果输出到myApp目录中。

buildOne('ajax-1.0.js', 'ajax-min.js');

示例代码UglifyJS_test