Steal build to run inside it's own scope


#1

Is it possible to build with steal so our app runs inside it’s own scope and doesn’t interfere with the global scope.

The problem we have is that our CanJS app is only on a part of the webpage and uses can-jquery. Other (older) widgets on the same page also use jquery but with an older version. And these versions conflict so they break the old widgets.

Our build file looks like this:

var stealTools = require("steal-tools");
var buildPromise = stealTools.build({
    main    : "main",
    config    : __dirname + "/package.json!npm"
}, {
    bundleAssets    : false,
    bundleSteal        : true
});

#2

I think you want to use jQuery’s noConflict capability, something like:

var jQuery = require("jquery");

var $ = jQuery.noConflict();

module.exports = $;

And then import this module anywhere you need jquery. That will prevent it from overriding the global jQuery.


#3

We’ve tried it with jQuery.noConflict but not with the result we were expecting.

Steal cannot build a “standalone” package that runs in it’s own scope?
What if we wanted multiple CanJS versions on the same page?


#4

That’s right, Steal doesn’t control scope. The modules do. A module which puts itself on the window is putting itself on the global scope.

I’m not sure about running multiple versions of CanJS. That would be a good feature to add if it’s not already possible. I would recommend posting an issue about this.