如何不与requireJS的require / define方法冲突？

Question

Looking for requirejs.noConflict() , or some way to remove the global footprint from the library. My use case is that I'm writing a widget to run in a 3rd party page which might already define require and define (with a previous version of requirejs or even another library entirely).

I've tried implementing this myself and it mostly works. For simplicity lets assume I do not restore original values, only remove the footprint. I do something like this in my data-main:

  var mycontext = requirejs.config({context : 'asdf', baseUrl : 'http://foo.com' });

  mycontext(['require','foo'], function (require, foo) {
        var f = require('foo');
  });

  // namespace cleanup
  window.requirejs = undefined;
  window.require = undefined;
  window.define = undefined;

The problem here is that the f value from require('foo') returns null, but only iff I do my namespace cleanup. This smells like a bug in requirejs, but I'm hoping there's an official no-conflict solution.

Hard to google this one due to all the jQuery related noConflict() questions.

Answer 1

The RequireJS documentation has a section on this titled " HOW CAN I PROVIDE A LIBRARY TO OTHERS THAT DOES NOT DEPEND ON REQUIREJS? "

You can also have a look at the example build file , which shows how wrap can be used.

A good example of how this works is the Flight library .

By default the library uses AMD but there is a standalone version that wraps all the modules in an anonymous function and includes a tiny require/define API at the top (They use their own build tool for this). Source can be found here .

Note that for this to work all the modules will require IDs, but the r.js optimiser will handle that for you.

Using these techniques should allow you to leave any already defined require/define variables alone.