自制js编译压缩小工具

自制js编译压缩小工具

月光魔力鸭

2019-11-14 13:26 阅读 519 喜欢 0 js编译 js压缩

关于js的编译和压缩,之前做过一个小工具了,主要就是自己项目成员大都没有这部分的技能,导致发布的时候总需要去编译压缩下.. 最终做了个命令行小工具.. 问题不在这里,前一阵子做压缩的时候发现压缩后竟然是undefined.最终才发现是es6的语法问题。

bug : 通过uglify-js 压缩js文件后文件内容为undefined

在对某个项目内的js文件做压缩的时候,发现了这个问题。结果发现是uglify-js不支持es6的语法和api

最终只能通过babel来进行编译。

解决: compress 命令行工具

对之前封装的命令行工具compressj2 做了改版。

核心代码
let babel = require('@babel/core');
let baseCode = `let {a} = {a :'name'}`;
babel.transform(baseCode, {
    presets: [
        ['@babel/preset-env', {
            "useBuiltIns": "entry",
            "modules": false,
            "corejs": 2, // 新版本的@babel/polyfill包含了core-js@2和core-js@3版本,所以需要声明版本,否则webpack运行时会报warning,此处暂时使用core-js@2版本(末尾会附上@core-js@3怎么用)
        }]
    ]
}, function(erra, result) {
    if (erra) {
        console.log('>>:' + filePath);
        console.log(erra);
    } else {
        console.log(result.code);
    }
});

babel的版本是7以上,与之前的老版本会有差异。这个一定要注意。

关于babel的使用,参考https://segmentfault.com/a/1190000019718925

命令行的使用


以后项目再发布做编译压缩的时候.. 只需要一个简单的命令compress 就OK啦。

转载请注明出处: https://chrunlee.cn/article/js-babel-uglify-tool.html


感谢支持!

赞赏支持
提交评论
评论信息 (请文明评论)
暂无评论,快来快来写想法...
推荐
在开发项目过程中,经常需要将开发的项目部署到服务器上,但是每个环境都有每个环境的配置等等,如果每次打包的时候都要去调整(可能删除、替换等),那就很烦人了,这里分享下自己实现的几个简单的小工具(当然这个工具可能只对我自己有用),希望能够帮到你。
今天写文章,突然发现自己常用的素材站换成了webp格式的图片.. 可惜本站还没准备加这个支持,所以准备加个webp转jpg的小功能,继续使用啦。
想做微信/支付宝支付很久了..奈何需要的资质太多,只能慢慢申请,等待,审核..终于下来了。
介绍几个日常开发中常用的几个小工具: anywhere / anywhere-auth / watchlessc / changeext
最近有接触到针对二维码进行识别的功能,然后对图片进行位置纠正、二维码扫描,并将数据进行整理。以下是通过nodejs做的,相对简单一些,没有太过严格,识别率也不是很高大约80%左右
在使用puppeteer 跳转窗口的时候,发现waitForNavigator 并不起作用,最后找到通过browser 获得page 并继续操作。
发布自己的nodejs应用后,需要进行管理,目前一般都pm2来进行管理,这里记录下常用的命令。
碰到个小需求,本来实现挺简单的,用的electron,开发模式下各种顺畅...半个小时就搞定了,结果倒在了electron打包上..这个坑我应该跳进来了好多次了..