使用UglifyJS合并/压缩JavaScript的方法


Posted in Javascript onMarch 07, 2012

build.js中的代码会去调用UglifyJS的接口函数以执行压缩任务。

1,去github下载最新的UglifyJS。两种方式下载,如果安装了git,进入git控制台使用如下命令
git clone git://github.com/mishoo/UglifyJS.git

或者使用http方式下载,点击zip下载。解压后其目录结构如下

使用UglifyJS合并/压缩JavaScript的方法

 

2,新建一个项目(文件夹)myApp,将uglify-js.js和lib目录拷贝到自己的项目中。如下

使用UglifyJS合并/压缩JavaScript的方法

3,在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); // parse code and get the initial AST 
ast = pro.ast_mangle(ast); // get a new AST with mangled names 
ast = pro.ast_squeeze(ast); // get an AST with compression optimizations 
var finalCode = pro.gen_code(ast); // compressed code here 
console.log(finalCode);

这段代码的大概意思是取fs模块,它是node的文件模块。 接着取UglifyJS的两个模块。后面就是UglifyJS的压缩流程了。

4,打开命令行,执行compress.js

使用UglifyJS合并/压缩JavaScript的方法

控制台输出了压缩后的代码。好了,就这么简单。
5,既然在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
Javascript 相关文章推荐
一个简单的js树形菜单
Dec 09 Javascript
jqueyr判断checkbox组的选中(示例代码)
Nov 08 Javascript
jsp网页搜索结果中实现选中一行使其高亮
Feb 17 Javascript
JavaScript实现的一个计算数字步数的算法分享
Dec 06 Javascript
JavaScript删除指定子元素代码实例
Jan 13 Javascript
Java框架SSH结合Easyui控件实现省市县三级联动示例解析
Jun 12 Javascript
概述一个页面从输入URL到页面加载完的过程
Dec 16 Javascript
Vue数据驱动模拟实现2
Jan 11 Javascript
js实现简单的计算器功能
Jan 16 Javascript
微信小程序 弹框和模态框实现代码
Mar 10 Javascript
JS 实现缓存算法的示例(FIFO/LRU)
Mar 20 Javascript
微信小程序实现上传图片裁剪图片过程解析
Aug 22 Javascript
Uglifyjs(JS代码优化工具)入门 安装使用
Apr 13 #Javascript
node.js 一个简单的页面输出实现代码
Mar 07 #Javascript
服务器端的JavaScript脚本 Node.js 使用入门
Mar 07 #Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
Mar 07 #Javascript
拥抱模块化的JavaScript
Mar 07 #Javascript
那些年,我还在学习jquery 学习笔记
Mar 05 #Javascript
什么是DOM(Document Object Model)文档对象模型
Mar 05 #Javascript
You might like
php操作excel文件 基于phpexcel
2010/07/02 PHP
php echo, print, print_r, sprintf, var_dump, var_expor的使用区别
2013/06/20 PHP
linux下安装php的memcached客户端
2014/08/03 PHP
PHP扩展Memcache分布式部署方案
2015/12/06 PHP
PHP中list()函数用法实例简析
2016/01/08 PHP
php文件上传、下载和删除示例
2020/08/28 PHP
php基于curl实现的股票信息查询类实例
2016/11/11 PHP
PHP基于ICU扩展intl快速实现汉字转拼音及按拼音首字母分组排序的方法
2017/05/03 PHP
JavaScript Event学习第三章 早期的事件处理程序
2010/02/07 Javascript
javascript怎么禁用浏览器后退按钮
2014/03/27 Javascript
jQuery 取值、赋值的基本方法整理
2014/03/31 Javascript
jQuery和AngularJS的区别浅析
2015/01/29 Javascript
分享自己用JS做的扫雷小游戏
2016/02/17 Javascript
使用伪命名空间封装保护独自创建的对象方法
2016/08/04 Javascript
深入浅析JavaScript中的3DES
2016/08/24 Javascript
jquery 手势密码插件
2017/03/17 Javascript
bootstrap fileinput实现文件上传功能
2017/08/23 Javascript
基于openlayers4实现点的扩散效果
2020/08/17 Javascript
php中and 和 &&出坑指南
2018/07/13 Javascript
微信小程序车牌号码模拟键盘输入功能的实现代码
2018/11/11 Javascript
使用post方法实现json往返传输数据的方法
2019/03/30 Javascript
JS实现可切换图片的幻灯切换效果示例
2019/05/24 Javascript
了解重排与重绘
2019/05/29 Javascript
JS替换字符串中指定位置的字符(多种方法)
2020/05/28 Javascript
python 实现归并排序算法
2012/06/05 Python
python实现两个文件合并功能
2018/04/01 Python
Python3之字节串bytes与字节数组bytearray的使用详解
2019/08/27 Python
Pycharm小白级简单使用教程
2020/01/08 Python
Pytorch 使用CNN图像分类的实现
2020/06/16 Python
Zavvi荷兰:英国大型音像制品和图书游戏零售商
2018/03/22 全球购物
药剂学专业应届生自荐信
2013/09/29 职场文书
经贸韩语专业大学生职业规划
2014/02/14 职场文书
车间机修工岗位职责
2014/02/28 职场文书
优秀班组事迹材料
2014/12/24 职场文书
Java方法重载和方法重写的区别到底在哪?
2021/06/11 Java/Android
Python 如何利用ffmpeg 处理视频素材
2021/11/27 Python