Set Up Jsfiddle With Requirejs, Socketio, Backbone

I've spent more than half a day trying to set up a requirejs, socket.io, backbonejs fiddle so as to solve another SO question. Here is what I tried. You may checkout my fiddle I t

Solution 1:

Lots of errors.

1. You should not use the HTML window at all for this. You can put everything in the JS window.

2. You should not put .js extensions in paths.

3. There's no need to use fallbacks for the code you have the the values in paths should be strings rather than arrays.

4. You had typos in your URLs in paths.

5. This line var io = require('socket.io')cannot work. This is RequireJS, not CommonJS. Such a call could work inside a define call.

6. Backbone has not needed a shim for quite a while now. Your shim for it is useless.

7. You don't need to do Backbone.$ = $.

8. For historical reasons both jQuery and Backbone leak themselves into the global space. So you don't have to do this manually.

Here's the cleaned up JS:

requirejs.config({
   paths: {
     'socket.io': 'https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.1/socket.io',
     'jquery': 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min',
     'underscore': 'https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min',
     'backbone': 'https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min'
   },
   waitSeconds: 3
});


require(['jquery', 'underscore', 'backbone', 'socket.io'], function(jq, us, bb, io) {
  console.log($, Backbone.$, Backbone);
});

Note how the console.log relies on $ and Backbone being in the global space.

And a fork of your fiddle.