JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法

一、UglifyJS

UglifyJS是用JavaScript编写的JavaScript压缩工具。
官网:http://lisperator.net/uglifyjs/

1、通过NPM安装UglifyJS

(1)安装Node.js

从Node.js官网https://nodejs.org/en/下载对应平台的安装程序,当前最新版本11.4.0,推荐版本10.14.2。
本人下载的是10.14.2,下载下来是一个node-v10.14.2-x64.msi安装包,按照默认下一步安装。
安装成功后在cmd命令提示符下输入node -v,可以显示版本号:

C:\Users\lc>node -v

v10.14.2
要退出Node.js环境,连按两次Ctrl+C。

(2)关于NPM

NPM是随同NodeJS一起安装的默认包管理工具,通过NPM可以安装、共享、分发代码,管理项目依赖关系。
在cmd命令提示符下输入npm -v,可以显示版本号:

C:\Users\lc>node -v

6.4.1

(3)安装UglifyJS

在cmd命令提示符下输入:

npm install uglify-js

2、压缩JS文件

(1)在cmd命令提示符下,用cd命令定位到JS文件所在目录;
(2)输入压缩命令:

uglifyjs test.js test2.js -c -m -o test-outpout.js

test.js和test2.js是待压缩文件,test-outpout.js是压缩后文件。

常用参数说明:

-o,--output 指定输出文件,默认情况下为命令行
-b,--beautify 美化代码格式的参数
-m,--mangle 改变变量名称
-r,--reserved 保留的变量名称,不需要被-m参数改变变量名的
-c,--compress 代码压缩
--comments 用来控制注释的代码的

二、Google Closure Compiler

Closure Compiler应用程序是一个Java 命令行工具,用来对JavaScript代码进行压缩、优化和排错。

官网:https://developers.google.com/closure/compiler/

1、下载:

官网下载地址为https://dl.google.com/closure-compiler/compiler-latest.zip

解压后有3个文件:

closure-compiler-v20181210.jar
COPYING
README.md

打开README.md帮助文档,可以看到其中有一行说明:Closure Compiler需要Java 8或以上版本。

2、命令行下压缩js文件:

(1)在解压后的ClosureCompiler目录新建一个测试的text.js文件
(2)打开cmd命令行,并cd定位到ClosureCompiler目录;
(3)输入压缩命令:

java -jar closure-compiler-v20181210.jar --js test.js --js_output_file test-outpout.js
test.js是待压缩文件,多个文件可用空格间隔,test-outpout.js是压缩后文件。

以上就是JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法的详细内容,更多关于UglifyJS和Google Closure Compiler用法的资料请关注我们其它相关文章!

(0)

相关推荐

  • webpack3里使用uglifyjs压缩js时打包报错的解决

    环境:webpac<4的场景下,安装uglifyjs. cnpm install uglifyjs-webpack-plugin -D 安装完毕后,去npm里查看uglifyjs的使用方法并添加到代码中: const UglifyJsPlugin = require('uglifyjs-webpack-plugin') module.exports = { //... optimization: { minimizer: [new UglifyJsPlugin()] } }; 执行打包命令后报错

  • 使用UglifyJS合并/压缩JavaScript的方法

    build.js中的代码会去调用UglifyJS的接口函数以执行压缩任务. 1,去github下载最新的UglifyJS.两种方式下载,如果安装了git,进入git控制台使用如下命令 git clone git://github.com/mishoo/UglifyJS.git 或者使用http方式下载,点击zip下载.解压后其目录结构如下 2,新建一个项目(文件夹)myApp,将uglify-js.js和lib目录拷贝到自己的项目中.如下 3,在myApp中新建一个compress.js,内容如

  • Uglifyjs(JS代码优化工具)入门 安装使用

    你也可以尝试一下在线版的Uglifyjs: http://sweet.fengyin.name/ 需要先安装node,进入命令行,查看node,npm是否正确安装. 接下来安装UglifyJS,命令如:npm install uglify-js -g 最后别忘了把node和npm添加到环境变量中,我的分别是 C:\Program Files (x86)\nodejs\; C:\Users\taozhou\AppData\Roaming\npm; 现在就可以使用uglifyjs就行压缩了,如 ug

  • node下使用UglifyJS压缩合并JS文件的方法

    现在UglifyJS的最新版本为 2.8.13,主要功能为JS的压缩和合并,下面直接进入教程: 安装: <span style="font-size:18px;color:#006600;">npm install uglify-js -g</span> 将uglifyjs安装为全局变量,方便我们在任何地方使用. <span style="color:#006600;">下面是shell命令的中文解释: * source-map

  • 解决iview打包时UglifyJs报错的问题

    使用npm run dev时运行是ok的,但是npm run build打包时iview报错, 如下: 原因是iview中使用了es6语法,然而uglifyJs是不支持的,打开我们的build/webpack.prod.conf.js文件,可以看到 // UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify new we

  • JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法

    一.UglifyJS UglifyJS是用JavaScript编写的JavaScript压缩工具. 官网:http://lisperator.net/uglifyjs/ 1.通过NPM安装UglifyJS (1)安装Node.js 从Node.js官网https://nodejs.org/en/下载对应平台的安装程序,当前最新版本11.4.0,推荐版本10.14.2. 本人下载的是10.14.2,下载下来是一个node-v10.14.2-x64.msi安装包,按照默认下一步安装. 安装成功后在c

  • JavaScript 代码压缩工具小结

    UglifyJS UglifyJS是构建于nodeJS服务器端之上的一个代码压缩工具,目前jQuery使用它来压缩,压缩效果比较好. GitHub主页:http://github.com/mishoo/UglifyJS/ 在线使用:http://marijnhaverbeke.nl/uglifyjs 使用方法: 从http://nodejs.org下载nodejs,用到的是node.exe 再从UglifyJS的GitHub主页下载它的最新版本 复制node.exe到UglifyJS的bin目录

  • 5款JavaScript代码压缩工具推荐

    推荐5款优秀的JavaScript代码压缩工具.代码压缩(也称代码最小化)是一个从源代码中消除所有不必要的字符的过程,包括删除所有不必要的空格字符.新行字符.评论等.代码压缩不影响源代码的功能,却提高加载时间(和web应用程序的性能),因为,要下载的文件的大小减少了. 以下是5款优秀的JavaScript代码压缩工具,我相信,他们定可以将你的脚本变得更轻巧,代码性能更出色. 一.YUI Compressor Yahoo出品!YUI Compressor是一个用Java编写,帮你最小化JavaSc

  • 推荐15个最好用的JavaScript代码压缩工具

    JavaScript 代码压缩是指去除源代码里的所有不必要的字符,而不改变其功能的过程.这些不必要的字符通常包括空格字符,换行字符,注释以及块分隔符等用来增加可读性的代码,但并不需要它来执行. 在这篇文章中,我们选择了15个最好用的 JavaScript 压缩工具,有简单的在线转换器,GUI工具和命令行界面等. 1. JavaScript Minifier It is a nice looking tool with an API to minify your js code. 2. JSMIn

  • 2014最热门的JavaScript代码高亮插件推荐

    对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染任何一种编程语言,包括一些关键字的着色,以及每行代码的缩进等.今天我们要来分享一些高性能的JavaScript代码高亮插件,这些JavaScript代码高亮插件将非常有效地帮你实现在网页上的代码编辑和展示. 1.SyntaxHighlighter – 最优秀的JavaScript代码高亮插件 SyntaxHighlighter 是一款完全基于JavaScript的代码高亮插件,Sy

  • 关于Google发布的JavaScript代码规范你要知道哪些

    Google为了那些还不熟悉代码规范的人发布了一个JS代码规范.其中列出了编写简洁易懂的代码所应该做的最佳实践. 代码规范并不是一种编写正确JavaScript代码的规则,而是为了保持源代码编写模式一致的一种选择.对于JavaScript语言尤其如此,因为它灵活并且约束较少,允许开发者使用许多不同的编码样式. Google和Airbnb各自占据着当前最流行的编码规范的半壁江山.如果你会在编写JS代码上投入很长时间的话,我强烈推荐你通读一遍这两家公司的编码规范. 接下来要写的是我个人认为在Goog

  • 优化 JavaScript 代码的方法小结

    优化 JavaScript 代码 作者: Gregory Baker, GMail 软件工程师 和 Erik Arvidsson, Google Chrome 软件工程师 需要的经验: JavaScript 相关工作知识 客户端脚本能让你的应用更加地动态和活跃, 但是浏览器对代码的解析可能造成效率问题, 而这种性能差异在客户端之间也不尽相同. 这里我们讨论和给出一些优化你的 JavaScript 代码的提示和最佳实践. 使用字符串 字符串连接操作会对 Internet Explorer 6 和

  • 果断收藏9个Javascript代码高亮脚本

    代码高亮很有用,特别是在需要在网站或者blog中显示自己编写的代码的时候,或者给其他人查看或调试语法错误的时候.我们可以将代码高亮,以便阅读者可以十分方便的读取代码块,增加用户阅读代码的良好体验. 目前,有很多免费而且有用的代码高亮脚本.这些脚本大多是由Javascript语言编写,也有些使用其它语言(比如java.Phyton或Ruby)等写的. 下面来推荐最受欢迎.最实用的9个Javascript代码高亮脚本. 1.SyntaxHighlighter 我相信这是最普遍代码高亮代码.它支持多种

  • 【经验总结】编写JavaScript代码时应遵循的14条规律

    本文讲述了编写JavaScript代码时应遵循的14条规律.分享给大家供大家参考,具体如下: 1. 总是使用 'var' 在javascript中,变量不是全局范围的就是函数范围的,使用"var"关键词将是保持变量简洁明了的关键.当声明一个或者是全局或者是函数级(function-level)的变量,需总是前置"var"关键词,下面的例子将强调不这样做潜在的问题. 不使用 Var 造成的问题 var i=0; // This is good - creates a

  • JavaScript代码因逗号不规范导致IE不兼容的问题

    在用ExtJS做前端开发的时候,发现系统可以在谷歌浏览器.火狐下正常显示,但是用IE浏览器打开就会报错,报错信息如:Expected identified, string or number.后来,检查的代码的时候发现,是由于js代码中逗号用的不规范导致的IE不兼容. 由于我是用eclipse来写代码的,下面我也就介绍怎么用eclipse来解决这个问题: 例如有下面这么一段不规范的代码: Ext.onReady(function() { var panel = Ext.create('Ext.c

随机推荐