Uncaught ReferenceError: RSVP is not defined , error while using require.js with rsvp

Question

I am working on a demo showing the error handling in promises using rsvp.js. Everything seemed fine, till I used the CDN url for rsvp.js in a tag. Now since I have require.js for module loading in my application, I tried loading the rsvp.js module via require js syntax. In the Chrome network tab, I see the rsvp.js module getting loaded properly as well, but I get the below error in console,

Uncaught ReferenceError: RSVP is not defined.

require(["bootstrap","js/rsvp"], function(bootstrap,rsvp) { 
$(document).ready(function () {
    function getEmployeeDetails() {
        var radioValue1 = $("input[name='option1']:checked").val();
        var requrl;
        if (radioValue1 == "fail") {
            requrl = "../../../testservice/getEmployeeIdss";
        } else {
            requrl = "../../../testservice/getEmployeeId";
        }
        return new RSVP.Promise(function (resolve, reject) {
            $.ajax({
                url: requrl,
                success: function (response) {
                    try {
                        $('#successBoard').append("<b> <i> Ajax Call 1 Succeeded! </i>  </b><br/>" + "Employee ID:" + response.stuId + "<br/>");
                        resolve(response.stuId);
                    } catch (e) {
                        reject(e);
                    }
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    console.log('Ajax 1 failed : Rejecting Promise 1');
                    $('#errorBoard').append("<b> <i> Ajax 1 failed : Rejecting Promise 1</i>  </b><br/>");
                    reject(thrownError);
                }
            });

        });
    }

score 2 · Accepted Answer · answered May 07 '15 at 10:31

I took a look at the source code of RSVP and found this code:

/* global define:true module:true window: true */
if (typeof define === 'function' && define['amd']) {
  define(function() { return RSVP; });
} else if (typeof module !== 'undefined' && module['exports']) {
  module['exports'] = RSVP;
} else if (typeof platform !== 'undefined') {
  platform['RSVP'] = RSVP;
}

The first if is where RSVP detects that it is running in an AMD environment and registers as an AMD module. So you won't have a global RSVP.

Now, in your code you require RSVP and bind it to the rsvp variable, all lowercase. So it is accessible as rsvp, not RSVP. Either refer to it as rsvp or change the variable name in the function you pass to require so that it is RSVP:

require(["bootstrap", "js/rsvp"], function (bootstrap, RSVP) {

Note that there's no point in having a reference to Bootstrap because it installs itself as a jQuery plugin, so you could do:

require(["js/rsvp", "bootstrap"], function (RSVP) {

Craicerjack · Answer 2 · 2015-05-08T13:28:25.183

0

You havent defined RSVP, you have included the rsvp libraray but set it to the variable rsvp and not RSVP, so when you call RSVP.Promise() it throws the error.
Basic usage via - https://github.com/tildeio/rsvp.js/-

var RSVP = require('rsvp');
var promise = new RSVP.Promise(function(resolve, reject){});

edited May 08 '15 at 13:28

answered May 07 '15 at 08:49

Craicerjack

6,203
2
31
39

Thanks, I tried the solution you have given, now its resolving RSVP properly but I am getting the below exception "Uncaught TypeError: Cannot read property 'Promise' of undefined" on the line, return new RSVP.Promise(function(resolve, reject) { – VishnuNair May 07 '15 at 11:33
Its not resolving RSVP if its reading it as undefined. Have you tried defining it within the `$(document).ready(){};`? as in the edit above – Craicerjack May 07 '15 at 11:59

Uncaught ReferenceError: RSVP is not defined , error while using require.js with rsvp

2 Answers2