using jQueryUI with closure compiler

问题:

I am having trouble getting a js app that uses jQuery UI to work after minifying using the closure compiler.

What I did:

1. Go here and load up the jqueryui js file
2. Asked to extern jQuery.ui
3. Copied the result to a file and used it as an extern file

The app broke, though. The dialogs do not show correctly anymore. The explosion effect doesn't work correctly, and there are several dialogs created. It is interesting that jQuery UI itself is working somewhat, since the dialogs were created. It is just that the app is misbehaving.

Am I missing something?

回答1:

The linked externs extractor doesn't appear to be able to extract externs from jQuery style files. This is most likely because jQuery uses the "extend" method to assign objects and that tool doesn't recognize that these properties need to be externed as well.

To address the issue, you would need to unravel the extend calls into direct assignments:

jQuery.extend(jQuery.ui, { prop1: function() {}, prop2: function() {});

Would become

jQuery.ui = jQuery.ui || {};
jQuery.ui.prop1 = function() {};
jQuery.ui.prop2 = function() {};

Also, when dealing with jQuery and using advanced optimizations, the "$" alias should be avoided completely.

This is just one of several reasons why compiling jQuery code with Closure-compiler advanced optimizations is challenging.