RequireJS: namespace in development environment to avoid conflict with other AMD lib

Question

The project I am working on uses requireJS. Works very well, when we want to build it, we use:

({
  // ..
  namespace: 'projectCodeName',
  // ..
});

But I sometimes need to load another library that also uses requireJS, but doesn't namespace it :().

I production, I don't have any issue, since my own requirejs is accessible on window.projectCodeName.require().

But in dev, nothing works as expected.

I found I can build requireJS without uglyfying, but still, it is a pity to loose file match, line numbers etc.

Can I use requireJS in development mode with a namespace. Something like:

<script data-namespace="projectCodeName" src="bower_components/requirejs/require.js"></script>

Cheers

EDIT:

I tried to do this manually like:

window.projectCodeName = window.projectCodeName || {};
window.projectCodeName.require = window.require;
window.projectCodeName.requirejs = window.requirejs;
window.projectCodeName.define = window.define;
delete require;
delete requirejs;
delete define;

Unfortunately the latter delete require doesn't work, it returns false, meaning this is a non-configurable property.

I thought requirejs was really good at avoiding global namespace issues, but instead it keeps bringing trouble. It is really annoying and disappointing.

score 0 · Accepted Answer · answered Nov 08 '16 at 14:38

There is multiversion support in requirejs, so you can set up a context per project. This is an example from the doc page. Is this what you want?

var reqOne = require.config({
  context: "version1",
  baseUrl: "version1"
});

reqOne(["require", "alpha", "beta",],
function(require,   alpha,   beta) {
  log("alpha version is: " + alpha.version); //prints 1
  log("beta version is: " + beta.version); //prints 1

  setTimeout(function() {
    require(["omega"],
      function(omega) {
        log("version1 omega loaded with version: " +
             omega.version); //prints 1
      }
    );
  }, 100);
});

var reqTwo = require.config({
  context: "version2",
  baseUrl: "version2"
});

reqTwo(["require", "alpha", "beta"],
    function(require,   alpha,   beta) {
  log("alpha version is: " + alpha.version); //prints 2
  log("beta version is: " + beta.version); //prints 2

  setTimeout(function() {
    require(["omega"],
      function(omega) {
        log("version2 omega loaded with version: " +
        omega.version); //prints 2
      }
    );
  }, 100);
});

RequireJS: namespace in development environment to avoid conflict with other AMD lib

1 Answers1