google closure compile jQuery Plugin

Question

I'm testing google closure-compiler and wanting to compile facebox Plugin with the option "Advanced" , an error occurs the function trying to find "a.H".

Has anyone tried to compile with this option jQuery plugins with a good result.

Thank you.

EDIT: Clearly this re-naming the jQuery methods, but is it possible to include jQuery and re-name all methods equally?.

EDIT

example of code with the option "externs_url":

with closure-compiler

js input code

// ==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 ouput code

(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

The jQuery library itself can't be compiled with ADVANCED_OPTIMIZATIONS, but you can compile your own code with advanced optimizations by using a Closure Compiler externs file that specifies the entire jQuery API. Download the externs file relevant to your jQuery version from the Closure Compiler repository. In the example, I'll use version 1.4.3

The following assumes that your application's code is in application.js and compiler.jar is the Google Closure Compiler jar file (available in this zip file):

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

The externs file tells Closure Compiler which jQuery methods exist so it knows not to rename them.

Answer 2

I encountered the same issue when trying to compress a custom JS library of jQuery Plugins. Closure (unless you give it a reason not to) will just rename any jQuery library calls from within your plugin. And worse yet it will not even warn you (how could it? it assumes you the programmer know what you are doing!) the solution is to reference the external js file (or url points to the library). I used the web tool: http://closure-compiler.appspot.com/home

by applying the fowlloing preamble, i was able to compile the file successfully:

// ==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==

The only issue remaining is making the compiler realize that the plugins name, cannot be simplified:

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

Because this is the name exposed to the world. Any ideas?

Answer 3

For a jQuery plugin to compile properly using the advanced option, you must modify your source code a little. All external functions should use quoted strings instead of dot-syntax. This will ensure that the closure compiler will preserve the external function name. For example;

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

will compile to

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

which is pretty useless. But, if you change the source a little

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

will output this

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

MUCH better!

Answer 4

When I tried the Closure compiler changed the names of the functions I accessed. So when I used (as an example) $.each(// code) the compiler changed it to $.a(// code ). I believe there is your problem.

Answer 5

Yes, you would have to concatenate both jquery.js and plugin.js into one file, but at the moment some parts of jQuery doesn't compress correctly with Advanced Compilation option, but you can still use the Simple Compilation.

I'm sure jQuery team will soon release a version which can be compiled using Advanced Compilation option.

If you're interested in Advanced Compilation check out these tutorials. Once you've read em, you'll understand why some parts need changing before you'll be able to compile em using Advanced Compilation without errors.

Answer 6

I think you have to include all scripts within your application for it to work across all of them.