使用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实现判断当前网址的来路如果不是指定的来路就跳转到指定页面
May 02 Javascript
jquery实现的一个导航滚动效果具体代码
May 27 Javascript
JS 添加千分位与去掉千分位的示例
Jul 11 Javascript
js鼠标及对象坐标控制属性详细解析
Dec 14 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 Javascript
js实现特定位取反原理及示例
Jun 30 Javascript
jquery使用each方法遍历json格式数据实例
May 18 Javascript
详解JavaScript中数组和字符串的lastIndexOf()方法使用
Mar 13 Javascript
带你了解session和cookie作用原理区别和用法
Aug 14 Javascript
JS实现获取进今年第几天是周几的方法分析
Jun 27 Javascript
解决vue下载后台传过来的乱码流的问题
Dec 05 Vue.js
帮你提高开发效率的JavaScript20个技巧
Jun 18 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
10条PHP编程习惯助你找工作
2008/09/29 PHP
phpMyAdmin 链接表的附加功能尚未激活的问题
2010/08/01 PHP
Zend的Registry机制的使用说明
2013/05/02 PHP
PHP保留两位小数并且四舍五入及不四舍五入的方法
2013/09/22 PHP
使用PHP函数scandir排除特定目录
2014/06/12 PHP
PHP图像识别技术原理与实现
2016/10/27 PHP
DOM基础教程之使用DOM
2015/01/19 Javascript
实现JavaScript的组成----BOM和DOM详解
2016/05/18 Javascript
JavaScript简单实现弹出拖拽窗口(一)
2016/06/17 Javascript
Jq通过td获取同行其它列td的方法
2016/10/05 Javascript
基于JS实现的随机数字抽签实例
2016/12/08 Javascript
EasyUI学习之DataGird分页显示数据
2016/12/29 Javascript
移动端手指放大缩小插件与js源码
2017/05/22 Javascript
react实现菜单权限控制的方法
2017/12/11 Javascript
Angular 如何使用第三方库的方法
2018/04/18 Javascript
Vue 组件注册实例详解
2019/02/23 Javascript
小程序实现新用户判断并跳转激活的方法
2019/05/20 Javascript
jQuery中DOM操作原则实例分析
2019/08/01 jQuery
JavaScript forEach中return失效问题解决方案
2020/06/01 Javascript
[01:00:59]VP VS VG Supermajor小组赛胜者组第二轮 BO3第二场 6.2
2018/06/03 DOTA
推荐下python/ironpython:从入门到精通
2007/10/02 Python
详解 Python中LEGB和闭包及装饰器
2017/08/03 Python
详解Python核心对象类型字符串
2018/02/11 Python
python中利用h5py模块读取h5文件中的主键方法
2018/06/05 Python
Python正则表达式和re库知识点总结
2019/02/11 Python
使用PyQt4 设置TextEdit背景的方法
2019/06/14 Python
ipad上运行python的方法步骤
2019/10/12 Python
Python如何访问字符串中的值
2020/02/09 Python
Java ExcutorService优雅关闭方式解析
2020/05/30 Python
MONNIER Frères英国官网:源自巴黎女士奢侈品配饰电商平台
2018/12/06 全球购物
Tostadora意大利:定制T恤
2019/04/08 全球购物
销售顾问的岗位职责
2013/11/13 职场文书
环境工程毕业生自荐信
2013/11/17 职场文书
文秘自荐信
2014/06/28 职场文书
人才市场接收函
2015/01/30 职场文书
Python 处理表格进行成绩排序的操作代码
2021/07/26 Python