Including external js with requirejs

Question

I have the following in my js file that is called by requirejs

    define([
      'jquery',
      'backbone',
      'mobiledetect'
    ],
 function($, Backbone, mobiledetect) {
  var MobileCheckView = Backbone.View.extend({
     initialize: function(){
     var md = new MobileDetect(window.navigator.userAgent);
     if (md.mobile() || md.phone() || md.tablet()) {
        $('#mho_app').popup('show');
     } 
     }
    });
     return MobileCheckView;
    });

I get Uncaught ReferenceError: MobileDetect is not defined when referencing the external file via path in my main.js file

I have tried defining it directly at the top of the file as well with no luck. What am I missing that's keeping the script from loading and giving me the object?

    define('mobiledetect', ['https://cdnjs.cloudflare.com/ajax/libs/mobile-detect/1.3.6/mobile-detect.min.js'], function () {
       var md = new MobileDetect(window.navigator.userAgent);
       return md;
   });

Eric Bronnimann · Accepted Answer · 2018-01-20 03:29:12Z

1

I suggest using the paths configuration in RequireJS to set mobiledetect to the URL, like so. Note that the ".js" is left off of the URL. RequireJS will automatically add the ".js" extension.

require.config({
  paths: {
    'mobiledetect': 'https://cdnjs.cloudflare.com/ajax/libs/mobile-detect/1.3.6/mobile-detect.min'
  }
});
require(['mobiledetect'], function (MobileDetect) {
  var md = new MobileDetect(window.navigator.userAgent);
  if (md.mobile() || md.phone() || md.tablet()) {
    alert('Mobile Device');
  }
  else {
    alert('Must be a desktop?');
  }
});

See this JSFiddle example to see the code in action. You will get an alert stating whether you are on a mobile or desktop browser.

Also, the parameter mobiledetect should be MobileDetect to match the new MobileDetect call.

answered Jan 20, 2018 at 3:29

Eric Bronnimann

9517 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mr Brimm Over a year ago

require(['mobiledetect'], function (MobileDetect) looks like the piece I needed. I did add paths in require.config in the main js file so I think I had that part right. Gotta try this on Monday, but this looks like it does the trick. Thanks.

Collectives™ on Stack Overflow

Including external js with requirejs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related