module.exports “Module is not defined”

Question

So, I am using RequireJS and React, trying to load a third-party component, which has been installed with:

npm install react-autocomplete

T

Answer 1

RequireJS cannot load CommonJS modules as-is. However, there is a minimal modification you can make to them to load them. You have to wrap them in a define call like this:

define(function (require, exports, module) {

  module.exports = {
    Combobox: require('./combobox'),
    Option: require('./option')
  };

});

If you have a bunch of modules you need to convert, or if you are using a third-party library written in the CommonJS pattern and want to convert it as part of a build process, you can use r.js to perform the conversion for you.

Answer 2

The problem is that requireJS doesn't support CommonJS modules only AMD. So if the third party library doesn't support AMD then you'll have to jump through some hoops to get it to work.

If you have the option I would suggest using browserify or webpack for module loading since those are the tools that the majority of the react community have chosen and practically all third-party react components are published on npm as CommonJS modules.