jianbine / articles

文档记录
0 stars 0 forks source link

如何通过webpack混淆压缩js? #5

Open jianbine opened 5 years ago

jianbine commented 5 years ago
var fs = require("fs")
var path = require("path")
var jsPath = '/Public/statics/src/js';
var srcPath = '.' + jsPath;
var root = path.join(__dirname) + jsPath;
var entryArray = [];
readDirSync(root);
var entryString  = '';
entryString = "{" + entryArray.join(',') + "}";
entryObj = eval('(' + entryString + ')');
//扫描整个目录
function readDirSync(path){
    var pa = fs.readdirSync(path);
    pa.forEach(function(ele,index){
        var info = fs.statSync(path+"/"+ele)
        if(info.isDirectory()){
            // console.log("dir: "+ele)
            readDirSync(path+"/"+ele);
        }else{
            var entryStr = formatResult(path,root,ele);
            entryArray.push(entryStr);
        }
    })
}
//格式化指定字符串
function formatResult(path,root,name) {
    // 计算路径
    var start = root.length;
    var tmpPath = path;
    tmpPath = tmpPath.substring(start + 1)
    var filename = name.substring(0,name.lastIndexOf("."));
    var filePath = tmpPath + '/' + filename;
    var slash = '/';
    if(filePath.indexOf('/') == 0){
        filePath = filePath.substring(1);
        slash = '';
    }
    var valFilePath = tmpPath + '/' + name;
    var entryStr = "'"+ filePath +"':'"+ srcPath + slash + valFilePath +"'";
    // console.info(entryStr);
    // console.info("filePath: " + filePath);
    // console.log("file: "+ele)
    return entryStr;
}

//自动拷贝css文件到dist目录下
const { spawn } = require('child_process');
const rm = spawn('rm', ['-r','./Public/statics/dist/css']);
const cp = spawn('cp', ['-prf', './Public/statics/src/css','./Public/statics/dist/css']);

module.exports = {
    entry: entryObj,
    output: {
        filename: '[name].js',
        path: path.resolve(__dirname,'Public/statics/dist/js'),
    }
}

通过上述,可以实现将src底下的js文件进行混淆压缩,并且添加到dist目录下。 关于css的压缩,在上诉中并未实现,仅仅只是实现了目录的文件转移而已。如果需要进行压缩,可自行通过less或者scss等工具实现。