综述:实现多个js文件合并,压缩,以达到性能优化的目的,以件量预测页面为例,提高约40%加载速度
1.合并功能代码
var fs=require('fs');
var fileder="F:/eos-ops/ops-weber/webolder/WebRoot";//需要监听的文件路径
fs.readdir(fileder,function (ev,file) { //不需要判断是否有内容
//1.只有有一个文件发生了变化,我们就需要对这个文件夹下的文件进行读取,然后合并
fs.readdir(fileder,function (err,dataList) {
var arr=[];
var js=[
{path:"/html/common/tmpres/js/EventEmitter.min.js"}, //自定义事件监听库
(https://github.com/Olical/EventEmitter)
{path:"/html/common/tmpres/js/moment.js"}, //时间转换插件
{path:"/html/common/tmpres/js/daterangepicker.js"}, // 日期选择器插件
{path:"/html/EOS_OPS_PROJECT/pickerDateRange/js/monthPicker.js"},
];
js.forEach(function (f) {//回调函数中的f对应每一个文件名
var info=fs.statSync(fileder+f.path);//fs.stat() 检查一个文件是否存在
if(info.mode==33206){
arr.push(fileder+f.path);
}
});
//2.读取数组中的文件并合并
var content='';
arr.forEach(function (f) {
console.log(f);
var c= fs.readFileSync(f);
content+=c.toString()+'\n';
});
fs.writeFile('./output/out2.js',content) //将合并后的内容生成到指定位置
})
});
2.合并代码并实现压缩代码
var fs = require('fs');
var jsp = require("./uglify-js").parser;
var pro = require("./uglify-js").uglify;
// 批量读取文件,压缩之
function buildOne(fileIn, fileOut) {
if (fileIn.length > 0) {
var finalCode = [];
var origCode = '';
var ast = '';
for (var i = 0,len = fileIn.length; i < len; i++) {
origCode = fs.readFileSync(fileIn[i], 'utf8');
ast = jsp.parse(origCode);
ast = pro.ast_mangle(ast);
ast = pro.ast_squeeze(ast);
finalCode.push(pro.gen_code(ast), ';');
};
}
fs.writeFileSync(fileOut,finalCode.join(''),'utf8');
}
//压缩首页js
var documentationArrOut=[
"F:/eos-ops-core-01381347/ops-weber/webolder/WebRoot/html/common/tmpres/js/EventEmitter.min.js", //自定义事件监听库(https://github.com/Olical/EventEmitter)
"F:/eos-ops-core-01381347/ops-weber/webolder/WebRoot/html/common/tmpres/js/moment.js", //时间转换插件
"F:/eos-ops-core-01381347/ops-weber/webolder/WebRoot/html/common/tmpres/js/daterangepicker.js", // 日期选择器插件
];
buildOne(documentationArrOut,'./test/out2.js');
console.log("compiling over");