babel-plugin-transform-import-as-amd
v0.0.12
Published
Simplified imports and exports
Downloads
1,710
Maintainers
Readme
babel-plugin-transform-import-as-amd
Limited transformer for ECMAScript 2015 modules (AMD)
Converts this code:
import x from '/path/to/x';
import y from '/path/to/y';
doSomething();
export default x + y;
Into this one:
define(['/path/to/x', '/path/to/y'], function (x, y) {
"use strict";
var _exports = {};
doSomething();
_exports.default = x + y;
return _exports.default;
});
Instead of this one (generated with babel-plugin-transform-es2015-modules-amd
):
define(['exports', '/path/to/x', '/path/to/y'], function (exports, _x, _y) {
Object.defineProperty(exports, "__esModule", {
value: true
});
var _x2 = _interopRequireDefault(_x);
var _y2 = _interopRequireDefault(_y);
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
'default': obj
};
}
doSomething();
exports.default = _x2.default + _y2.default;
});
Supported features:
import SPECIFIER from 'PATH'
import 'PATH'
import {SPECIFIER1, SPECIFIER2 as SPECIFIER3} from 'PATH'
export default NODE
export {item as name}
export * from 'PATH'
auto named modules: define("file", [], func...)
Other features aren't supported.
Warning. If no import
or export
are presented in JavaScript file, the plugin does nothing (means it doesn't wrap code with define
).
Installation
$ npm install --save-dev babel-plugin-transform-import-as-amd
Usage
Via .babelrc
(Recommended)
.babelrc
{
"plugins": ["transform-import-as-amd"]
}
Usage auto names
Via .babelrc
(Recommended)
.babelrc
{
"plugins": [
["transform-import-as-amd", {
// convert full file paths to module name
moduleName: true,
// module name is relative path at basePath
basePath: __dirname,
// paths to some modules, like are require-config.js
paths: {
module: "relative/path"
}
}]
]
}
/some/module.js Converts this code:
export default function MyModule() {}
Into this one (with moduleName option):
define("some/module", [], function (x) {
"use strict";
var _exports = {};
_exports.default = function MyModule() {};
return _exports;
});
Into this one (withOUT moduleName option):
define([], function (x) {
"use strict";
var _exports = {};
_exports.default = function MyModule() {};
return _exports;
});
More examples
Converts this code:
import * as x from 'PATH'
Into this one:
define(['PATH'], function (x) {
"use strict";
});
Converts this code:
import {x, y} from 'PATH'
Into this one:
define(['PATH'], function (_PATH) {
"use strict";
var x = _PATH.x;
var y = _PATH.y;
});
Converts this code:
import "css!style.css"
import js from "js"
Into this one:
define(["css!style.css", "js"], function (_cssStyleCss, js) {
"use strict";
});
Converts this code:
export function test() {}
Into this one:
define([], function () {
"use strict";
var _exports = {};
function test() {}
_exports.test = test;
return _exports;
});
Converts this code:
export default function test() {}
Into this one:
define([], function () {
"use strict";
var _exports = {};
_exports.default = function test() {};
return _exports.default;
});
Converts this code:
export * from "module"
Into this one:
define(["module"], function (_module) {
"use strict";
var _exports = {};
for (var _key in _module) {
_exports[_key] = _module[key];
}
return _exports;
});
with enabled moduleName option, Converts this code (some/module.js):
define([], function() {});
Into this one:
define("some/module", [], function() {});
with enabled moduleName option, Converts this code (some/module.js):
define("another-name", [], function() {});
Into this one (no modifications):
define("another-name", [], function() {});
with enabled paths option
// options = {
// basePath: __dirname,
// paths: {
// helpers: "lib/helpers"
// }
// }
// filename = "some/file.js"
import {isString} from "../lib/helpers"
Into this one:
define(["helpers"], function(_libHelpers) {
"use strict";
var isString = _libHelpers.isString;
});