使用uglifyjs压缩JS

一般vue项目完成打包以后需要优化,特别是首次打开加载速度们,webpack打包以后js文件体积很大等方法,可以用这个方法来压缩js文件

  1. 安装node.js
  2. 安装当前应用 -- uglifyjs

如何安装node.js就不再介绍了, 百度一下一大把.安装uglifyjs如下:

  • uglifyjs压缩JS文件
    ======

演示如何使用uglifyjs压缩JS

打开一个用于存放JS文件的文件夹,文件目录如下图:

准备压缩lazyLoad.js做实验, 当前该文件的大小为10KB.我们来进行压缩,看看压缩后的文件大小是多少?

这里给大家介绍一个小技巧, 以方便快速地打开cmd, 并定位到当前目录.

点击"在此处打开命令窗口"后即可以进入到cmd, 你会发现已经切换到当前文件所在的路径了.
此时输入命令对lazyLoad.js文件进行压缩并输出文件名为lazyLoady.min.js的文件:

uglifyjs lazyLoad.js -o lazyLoad.min.js

也可以运行如下代码, 测试一下-m参数:

uglifyjs lazyLoad.js -m -o lazyLoad.min.js

以看到, 压缩后只有3KB, 相比之前的, 文件缩小了3倍多.快去试下吧!

    • 结束语
      ======
      对于自己来说, 本文就相当于做笔记. 需要注意的是, uglifyjs只能压缩js文件(且只支持ECMAScript 5: ES5).

原文地址:https://www.cnblogs.com/mahmud/p/10747826.html

时间: 2024-10-15 18:43:46

使用uglifyjs压缩JS的相关文章

uglifyjs压缩JS

需要先安装node,进入命令行,查看node,npm是否正确安装. 接下来安装UglifyJS,命令如:npm install uglify-js -g 于是,下面就可以压缩JS了. 下面演示如何使用uglifyjs压缩JS. 我的桌面上有个名叫formini的文件夹,我会把要压缩的文件放在其中,然后再压缩. 现在,我从内部拷贝了一个名叫inet.js的JS文件到这个文件夹中,然后: 打开cmd, 这个不会我就没有办法了 目录引到formini文件夹,cd 然后什么什么的,这个不会我也没有办法了

uglifyjs压缩JS的

一.故事总有其背景 年末将至,很多闲适的时间,于是刷刷微博,接触各种纷杂的信息——美其名曰“学习”.运气不错,遇到了一个新名词,uglifyjs. 据说是用来压缩JS文件的,据说还能优化JS,据说是基于node的,还据说比Google Closure Compiler更带感,哦?激起了我的好奇心.百之谷之,哟,相关的介绍还不少.然后折腾了个把小时,基本上知道了是个怎么回事. 我觉得吧,还是有些用的,即使是不是从事node开发的人,抽个小空,share之,于是就有了本文.人总有浮躁的时候,我也不例

我是如何初体验uglifyjs压缩JS的

一.故事总有其背景 年末将至,很多闲适的时间,于是刷刷微博,接触各种纷杂的信息——美其名曰“学习”.运气不错,遇到了一个新名词,uglifyjs. 据说是用来压缩JS文件的,据说还能优化JS,据说是基于node的,还据说比Google Closure Compiler更带感,哦?激起了我的好奇心.百之谷之,哟,相关的介绍还不少.然后折腾了个把小时,基本上知道了是个怎么回事. 我觉得吧,还是有些用的,即使是不是从事node开发的人,抽个小空,share之,于是就有了本文.人总有浮躁的时候,我也不例

利用Node 搭配uglify-js压缩js文件,批量下载图片到本地

Node的便民技巧-- 压缩代码 下载图片 压缩代码 相信很多前端的同学都会在上线前压缩JS代码,现在的Gulp Webpack Grunt......都能轻松实现.但问题来了,这些都不会,难道就要面对几十个JS文件一遍遍来回“复制-压缩-创建-粘贴”,这样太不人性化了. 于是可以借助Node + uglify-js 轻松实现.(前提你会点node操作) 1.首先看一下目录: |--uglifyJS |--js |--test1.js |--test2.js |--uglify.js   //这

uglifyjs压缩批处理

uglifyjs. 据说是用来压缩JS文件的,据说还能优化JS,据说是基于node的,还据说比Google Closure Compiler更带感. uglifyjs压缩批处理我们不可能每次都打开cmd去键入压缩执行代码,容易写错不说(如上面那个结果图),还耗时,想想都会让人疯掉.懒人有懒法,花了点功夫,折腾了一个批处理文件,以后,想要压缩JS,只要双击运行这个.bat文件就可以了!完整代码如下: @echo off :: 设置压缩JS文件的根目录,脚本会自动按树层次查找和压缩所有的JS SET

webstorm 设置uglify 压缩js文件

第一步:打开npm,全局安装 npm install uglify-js -g 第二步: 打开webstorm的file->settings ->External Tools,点击左上角的"加号"标志add,进入对话框   第三步:在webstorm中的命令行,切换到要压缩的文件目录,输入命令 uglifyjs xxxx.js -o xxxx-min.js 成功!

webpack学习(六)打包压缩js和css

打包压缩js与css 由于webpack本身集成了UglifyJS插件(webpack.optimize.UglifyJsPlugin)来完成对JS与CSS的压缩混淆,无需引用额外的插件, 其命令webpack -p即表示调用UglifyJS来压缩代码,还有不少webpack插件如html-webpack-plugin也会默认使用UglifyJS. uglify-js的发行版本只支持ES5,如果你要压缩ES6+代码请使用兼容开发分支. UglifyJS可用的选项有: parse       解释

sublime text2之js压缩-Js Minifier

一款基于Google Closure compiler压缩Js文件插件. 快捷键: Ctrl+Alt+M            当前文件内压缩Js代码(不推荐) Ctrl+Alt+Shift+M   压缩Js并生成压缩文件 *.min.js 安装成功重启,如果报错,在配置里改一个参数,"compiler": "uglify_js", { // the closure compiler adds new lines every 500 characters // fo

.net 运用YUI相关的dll压缩js (按照自己的规则,想想都觉得强大和有趣)

写在前面 不管是做前端的还是做后台的,不管是懂javaScript的还是不太懂JavaScript的人,我想都或多或想的知道些许js压缩对于页面性能提升的效应吧. 之前老喜欢用在线压缩工具去压缩js,其实想想之前的这个做法就有些不寒而栗,假设一下,如果一个项目中的js有50个的话,你要去用在线压缩工具压缩js50次吗?仅仅发布一次就压缩50次,那是不是每个发布项目的时候都要去做这个工作,这是多么重复而双乏味的事情. 再假设,不同页面上引用了相同的n个js,如果我们只是按照单独的js去压缩的话,那