如何使用 Google Closure 编译器删除未使用的 JavaScript 代码？答案

【问题标题】：How do I use Google Closure compiler to remove unused JavaScript code?如何使用 Google Closure 编译器删除未使用的 JavaScript 代码？
【发布时间】：2010-07-07 21:38:34
【问题描述】：

如何使用 Google Closure 编译器删除未使用的代码？

我正在使用 JQuery Slider 控件，但在 JQuery 中没有使用任何其他控件。所以我读到 Advanced 模式下的 Google Closure 编译器可以删除未使用的代码，但我不知道如何。

我有 frontpage.html，它从我网站上托管的那个 html 页面链接到外部 JQuery、JQuery UI 和 JQuery Slider 控件。

在我的 frontpage.html 中，我还在 HTML 中嵌入了 JavaScript，用于启动 JQuery Slider 控件。

如何使用我使用 online Closure Compiler 评估我的 frontpage.html、JQuery、JQuery UI 和 JQuery Slider 以删除所有我不使用的未使用的 JQuery 代码？

【问题讨论】：

根据我自己的经验，在包含 jQuery 的代码上使用它是没有意义的。 Closure-compiler 不会删除未使用的 jquery 的废话。如果你用原生 javascript 写一些类似的东西会更好。

标签： javascript jquery jquery-ui google-closure google-closure-compiler

【解决方案1】：

有两种方法可以从组合输出脚本中删除/排除未使用的代码：

第一，涉及到使用ADVANCED_OPTIMIZATIONS编译级别（详细解释和使用参考Advanced Compilation and Externs）
第二个，是允许编译器manage dependencies（即使用--manage_closure_dependencies编译标志

在这两个选项中，使用 --manage_closure_dependencies 标志来删除未使用的代码的粒度较小（即排除文件级别的代码），但它确实允许您保持在 SIMPLE_OPTIMIZATIONS 编译级别。在任何一种情况下，您都必须包含网址 jQuery 和 jQueryUI 脚本以及使用页面中的 jQuery Slider 的代码 - 类似这样（第一个选项）：

// ==ClosureCompiler==
// @compilation_level ADVANCED_OPTIMIZATIONS
// @output_file_name default.js
// @code_url http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js
// @code_url http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.js
// ==/ClosureCompiler==

// ADD YOUR CODE HERE

希望这会有所帮助。

【讨论】：

【解决方案2】：

首先，作为初学者，我建议您尝试简单的优化。因为它无需任何配置即可工作并产生出色的结果。不要被名字误导。与现有的任何其他压缩工具相比，简单的优化可提供更好的节省。高级可能是您的下一步，但它有点复杂。

至于使用编译器。我的建议是将您的所有脚本打包到一个 javascript 文件，上传到您的网站，这样它就会有一个 url，然后将其传递给在线编译器。然后你点击Add和Compile就完成了。

您将在右侧看到已编译的代码。还会创建一个名为default.js 的文件，您可以下载。

下一步是根据您的需要重命名它，然后上传到您的服务器，更改 HTML 中的 .js 引用，您就大功告成了。玩得开心！

【讨论】：

【解决方案3】：

Closure Compiler 的 ADVANCED_OPTIMIZATION 目前无法拆分 jQuery。 jQuery 努力使用巧妙的运行时扩展、各种别名以及根据传递的参数服务于不同目的的函数来最小化自身，所有这些一起工作以使 jQuery 对编译器不透明。也就是说，适当的 Closure Compiler ADVANCED_OPTIMIZATION 支持在 jQuery 团队对 jQuery 1.8 的愿望清单中非常重要。

【讨论】：