Question

I’m trying to import SlickGrid into my application…but its attaching itself to the window even though I’m using AMD to load the module

Is there a way to use the Shim configuration to avoid polluting the namespace. Another problem might be that SlickGrid dependencies will be looking for it in the global namespace.

Ideas would be great.

shim:
  'grid/slick.core':
     deps: ["jquery"]
  'grid/slick.grid':
     deps: ["jquery"]
  'grid/jquery.event.drag-2.0.min':
     deps: ["jquery"]
  'grid/jquery.event.drop-2.0.min':
     deps: ["jquery"]

define [
 "grid/jquery.event.drag-2.0.min"
 "grid/jquery.event.drop-2.0.min"
 "grid/slick.core"
 "grid/slick.grid"
], () ->

There is my current Shim config as well as a module I’m using the grid in

Answer 1

In principle you can use the init() callback in the shim config to remove any objects from the global scope:

'grid/slick.core': {
  deps: ['jquery'],
  exports: 'Slick',
  init: function (bar) {
    //"this" is the global scope
    var slick = this.Slick;
    delete this.Slick;
    return slick;
  }
}

But as you’ve stated in your question, the library itself depends on the presence of the Slick property on the global object, and there isn’t much you can do about this.

You can either:

• contact the plugin author and ask him to add AMD support (or better yet, submit a pull request on github)
• wrap the plugin code in define calls yourself, and drop the shim config.