Map multiple js files in requirejs

Question

I want to include yahoo.js and yahoo-calendar.min.js from my custom module

yahoo.js

yahoo-calendar.min.js

basically i need to call the function from yahoo-calendar.min.js which require yahoo.js file, i tried to include it like this using requirejs-config.js from my custom module:

var config = {
    "map": {
        "*": {
            YAHOO: 'Vendor_Module::js/yahoo-calendar.min' 
        }
    }
};

i'm gonna use YAHOO as the alias , but i don't know where to put the yahoo.js file

the usage will be like this:

YAHOO.namespace("example.calendar");
                    YAHOO.example.calendar.init = function() {
                        YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1",'container-id');
                        YAHOO.example.calendar.cal1.render();
                    }

                    YAHOO.util.Event.onDOMReady(YAHOO.example.calendar.init);

Answer 1

You can add multiple js files in your requirejs-config.js file. Try like below,

var config = {
    'map': {
        '*': {
            'yahoo' : 'Vendor_Module::js/yahoo', 
            'yahoo-calendar': 'Vendor_Module::js/yahoo-calendar.min' 
        }
    },
    'shim': {
        'yahoo-calendar': {
            deps: ['yahoo']
        }
    }
};

Here, shim is used to create a dependency with your JS files, It will make sure that your yahoo.js file will be called before it will call yahoo-calendar.js

One more thing to note here is that you do not add .js extension in your requirejs-config.js file.