I have an existing application that is based on all AMD modules and uses require.js to combine things. I need to bring a bunch of es2015 code to this application as AMD modules and use Babel to turn them into AMD modules. Here is my babel configuration
babel: options: sourceMap: false plugins: [ 'transform-class-properties', 'transform-object-rest-spread', 'transform-es2015-modules-amd'] presets: [ 'react','es2015'] dist: files: [{ expand: true cwd: "src/foo/jsx" src: "**/*.js" dest: "build/foo/js/" ext: ".js" }]
The result works and generates AMD modules as follows, for example, for the myreact.js module:
define(["exports", "react", "prop-types"], function (exports, _react, _propTypes) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var _react2 = _interopRequireDefault(_react); var _propTypes2 = _interopRequireDefault(_propTypes); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var REQUIRED_FIELD_SYMBOL = "*"; function Blah(props) { ... } exports.default = Blah; });
Now when I use this AMD module in my other AMD modules with a definition, it is undefined
define([..., 'foo/js/myreact'], function(..., RM) { RM.Blah <---- this is undefied RM.default <---- still undefied
The generated code does not return an export.
In addition, I noticed that in my build.js called by require.js, the reactive model is displayed as follows:
define('foo/js/myreact',["exports", "react", "prop-types"], function (exports, _react, _propTypes){ .. }
I do not define export anywhere in my require.js configuration file, so how should I set the export?
Basically, how should I use my AMD modules for AMD in other AMD modules?