Loading jwplayer.js using Require.js

Question

So, I'm new to Require.js and I've been learning this library by loading various other libraries using Require.js methods.

I've successfully load Knockout.js objects, Chart.js object, as well as custom Require.js defined objects.

But I can't seem able to load jwplayer using Require.js. This is the error method I received: Uncaught TypeError: Cannot call method 'jwplayer' of undefined

This is my sample code (the Knockout, Chart objects all loaded successfully)

require(['jwplayer/jwplayer', 'libs/Chart', 'libs/knockout-2.1.0', 'appViewModel','helper/util'], function(jwplayer, chart, ko, appViewModel, util) {

//LOADING FROM jwplayer.js
jwplayer("player").setup({
    width: '320',
    height: '40',
    sources: [{
        file: "rtmp://127.0.0.1:1935/vod/mp3:sample_1.mp3"
    },{
        file: "http://127.0.0.1:1935/vod/sample_1.mp3/playlist.m3u8"
    }]
});

//LOADING FROM Chart.js
var barChartData = {
    labels : ["January","February","March","April","May","June","July"],
    datasets : [
        {
            fillColor : "rgba(220,220,220,0.5)",
            strokeColor : "rgba(220,220,220,1)",
            data : [65,59,90,81,56,55,40]
        },
        {
            fillColor : "rgba(151,187,205,0.5)",
            strokeColor : "rgba(151,187,205,1)",
            data : [28,48,40,19,96,27,100]
        }
    ]   
};
var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Bar(barChartData);

//LOADING FROM knockout-2.1.0.js
ko.applyBindings(new appViewModel());

//LOADING FROM A CUSTOM DEFINED OBJECT
util.greets(); 
    });

So how do you load jwplayer.js using Require.js?

Rick Quantz · Accepted Answer · 2013-03-30T02:42:24.903

jwplayer.js doesn't define a module for require.js, so you're going to have to use the shim config, something like this:

require.config({
    shim: {
        'jwplayer/jwplayer': {
            exports: 'jwplayer'
        }
    }
});

You can see more about how to use it in the requirejs api docs.

Edit: typo in code sample.

Edit 2: it should be noted that jwplayer() will return null if it can't find the player that you pass it, so even if it is loaded correctly, it will still throw that error. If you're getting the error even after including the configuration, try adding something like

console.log(jwplayer.api);

in the require callback and check your console to see if there's anything there.

Loading jwplayer.js using Require.js

1 Answers1

Linked