google 关闭编译 jQuery 插件

Question

我正在测试 google Closure-compiler 并希望编译 facebox 插件 带有选项“高级”，函数尝试查找“aH”时发生错误。

有没有人尝试使用此选项编译 jQuery 插件并取得了良好的结果。

谢谢。

编辑： 显然，这重新命名了 jQuery 方法，但是是否可以包含 jQuery 并同等地重新命名所有方法？

编辑

带有选项“externs_url”的代码示例：

带有closure-compiler

js输入代码

// ==ClosureCompiler==
// @output_file_name default.js
// @formatting pretty_print
// @compilation_level ADVANCED_OPTIMIZATIONS
// @warning_level QUIET
// @externs_url http://code.jquery.com/jquery-1.5.min.js
// ==/ClosureCompiler==

// ADD YOUR CODE HERE

var test = function($, context) {

  var
    _self = this;

  _self.mymethod = function() {

    var lista = $("a", context);

    lista.attr("target", "_blank");

    return lista.html();

  };


  return {"mymethod":_self.mymethod};

}.call({}, jQuery, context);    

js输出代码

(function(b, c) {
  this.a = function() {
    var a = b("a", c);
    a.attr("target", "_blank");
    return a.html()
  };
  return{mymethod:this.a}
}).call({}, jQuery, context);

Answer 1

jQuery 库本身无法使用 ADVANCED_OPTIMIZATIONS 进行编译，但是您可以使用指定整个 jQuery API 的 Closure Compiler externs 文件来编译您自己的代码并进行高级优化。从 Closure 下载与您的 jQuery 版本相关的 externs 文件编译器存储库。在示例中，我将使用版本 1.4.3

以下假设您的应用程序的代码位于 application.js 中，并且 compiler.jar 是 Google Closure Compiler jar 文件（可在此 zip 文件中找到：

java -jar compiler.jar \
--compilation_level ADVANCED_OPTIMIZATIONS \
--externs jquery-1.4.3.externs.js \
--js_output_file output.js \
application.js

externs 文件告诉 Closure Compiler 哪个 jQuery方法存在，因此它知道不要重命名它们。

Answer 2

我在尝试压缩 jQuery 插件的自定义 JS 库时遇到了同样的问题。闭包（除非你给它一个不这样做的理由）只会重命名插件中的任何 jQuery 库调用。更糟糕的是，它甚至不会警告你（怎么可能？它假设你程序员知道你在做什么！）解决方案是引用外部 js 文件（或指向库的 url）。我使用了网络工具：
http://closure-compiler.appspot.com/home

通过应用下面的序言，我能够成功编译文件：

// ==ClosureCompiler==
// @compilation_level ADVANCED_OPTIMIZATIONS
// @warning_level QUIET
// @output_file_name default.js
// @formatting pretty_print
// @externs_url http:// ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js
// @externs_url http:// ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.js
// ==/ClosureCompiler==

剩下的唯一问题是让编译器意识到插件名称不能简化：

(function($) { $.fn.extend({ <name>:function(options) { } }); })(jQuery);

因为这是暴露给世界的名称。有什么想法吗？

Answer 3

为了使用高级选项正确编译 jQuery 插件，您必须稍微修改源代码。所有外部函数都应使用带引号的字符串而不是点语法。这将确保闭包编译器保留外部函数名称。例如;

$.fn.pluginName = function(opts) {
  // plugin code
}

将编译为

$.a.b=function(){};

毫无用处的。但是，如果你稍微改变一下源，

$.fn['pluginName'] = function(opts) {
  // plugin code
}

输出会

$.a.pluginName=function(){};

好得多！

Answer 4

当我尝试闭包编译器更改了我访问的函数的名称。因此，当我使用（作为示例）$.each(// code)时，编译器将其更改为$.a(// code)。我相信有你的问题。

Answer 5

是的，您必须将 jquery.js 和 plugin.js 连接到一个文件中，但目前 jQuery 的某些部分无法使用 正确压缩高级编译选项，但您仍然可以使用简单编译。

我确信 jQuery 团队很快就会发布一个可以使用高级编译选项进行编译的版本。

如果您对高级编译感兴趣，请查看这些

Answer 6

我认为您必须将所有脚本包含在您的应用程序中，以便它可以在所有脚本中工作。