Jump to Table of Contents

Example: YUI Loader - Dynamically Adding YUI and External Modules

In this example we will create an external module and use it as a core module.

Creating your external module

This is a simple example of creating an external module with YUI.add.

This module simply adds an External namespace to the Y object and exports a single run method.

YUI.add('external', function(Y) {
    Y.External = {
        run: function() {
            Y.one('#marker').setHTML('External Module was loaded.');
        }
    }
}, '1.0.0', { requires: [ 'node' ] });

Using the instance config

Now that we have our external module, we need to add it to the modules config on the YUI instance that you want to attach this module to.

{
    modules: {
        external: {
            fullpath: '../assets/yui/external.js',
            requires: ['node']
        }
    }
}

Setting up for the module

Now we add the HTML needed to make this module run:

<div id="marker"></div>

Now we put it all together and you should see the message in the example box above.

YUI({
    modules: {
        external: {
            fullpath: '../assets/yui/external.js',
            requires: ['node']
        }
    }
}).use('external', function(Y) {
    Y.External.run();
});