module.exports“未定义模块”

Question

因此，我正在使用RequireJS和React，尝试加载已安装的第三方组件：

npm install react-autocomplete

结构在这里：https :
//github.com/rackt/react-
autocomplete/tree/master/lib

现在，我有一个main.js文件，它是在加载requireJS时启动的，看起来像这样：

require.config({
paths: {
      "react" : "react/react",
      "jsx-transformer" : "react/JSXTransformer",
      "react-autocomplete" : "node_modules/react-autocomplete/lib/main"
    }
});

require(["react"], function(react) {
    console.log("React loaded OK.");
});

require(["jsx-transformer"], function(jsx) {
    console.log("JSX transformer loaded OK.");
});

require(['react-autocomplete'], function (Autocomplete) {
    console.log("React autocomplete component loaded OK.");
    var Combobox = Autocomplete.Combobox;
    var ComboboxOption = Autocomplete.Option;
    console.log("Autocomplete initiated OK");
 });

现在，它们全部加载正常，但是第三条require语句为第三方组件中的main.js文件抛出“未定义模块”，如下所示：

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

我一直在阅读有关这与尝试使用CommonJS样式的模块有关的信息，但由于我是新手，所以我不知道该如何自行修复。

有没有人有一个清楚的例子说明我该如何解决？

Answer 1

RequireJS无法按原样加载CommonJS模块。但是，您可以对其进行最小的修改以加载它们。您必须将它们包装在这样的define呼叫中：

define(function (require, exports, module) {

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

});

如果您有一堆模块需要转换，或者您正在使用以CommonJS模式编写的第三方库，并且希望在构建过程r.js中进行转换，则可以使用该模块来执行转换。