Question

Here is my test code:

<script type="text/javascript">
YUI({
    modules: {
        'jquery': {
            fullpath: 'script/lib/jquery.min.js'
        },
        'jquery-blockui': {
            fullpath: 'script/lib/jquery.blockUI.js',
            requires: ['jquery']
        }
    }
}).use('jquery-blockui', function(Y, result){
    $.blockUI();
});
</script>

When it run, sometimes it work, sometimes dont work. Because jquery lib loaded after jquery-blockui.

errors like:

Uncaught ReferenceError: jQuery is not defined
Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)} has no method 'blockUI' 

So, What’s wrong with the code?

Answer 1

If you’re loading non-YUI scripts with the YUI Loader, then in your YUI config you generally need to set async: false to avoid this problem.

Try this recipe from the YUI 3 Cookbook: https://github.com/evangoer/yui3-cookbook/blob/master/examples/loading/use_jquery.html