Question

I’m using Require.js for my current project.

And I used to load Require.js config with require variable like

require = {
  paths: {
    backbone: "libs/backbone-min",
    bootstrap: "libs/bootstrap.min",
    jquery: "libs/jquery-1.7.2.min",
    underscore: "libs/underscore-min",
    order: "plugins/order",
    text: "plugins/text",
    use: "plugins/use"
  }
};
<script src="http://local.gungroo.com/app/js/config.js"></script>

This worked fine in All browser.

Recently, I switched to Coffescript and the code generated is something like

(function() {
  window.require = {
    paths: {
      backbone: "libs/backbone-min",
      bootstrap: "libs/bootstrap.min",
      jquery: "libs/jquery-1.7.2.min",
      underscore: "libs/underscore-min",
      order: "plugins/order",
      text: "plugins/text",
      use: "plugins/use"
    }
  };

}).call(this);

But second one breaks in IE8.

Does IE8 treat variable ‘var require’ and ‘window.require’ differently?

Answer 1

From the requirejs documention about configuration options:

Note: It is best to use var require = {} and do not use window.require
= {}, it will not behave correctly in IE.

This issue was reported to the requirejs project on github here. The issue reporter (dtanabe) offered some sample html and script that illustrates the problem. I’ve created a fiddle available here containing that sample code. Notice that for IE 9 it works the same way as other browsers (e.g. Chrome, Firefox), but when I changed the document mode in the developer tools to IE 8 the problem showed up. In response to this issue, jrburke (James Burke) added the documention that I mentioned above.