@babel/plugin-transform-modules-amd

What is @babel/plugin-transform-modules-amd?

The @babel/plugin-transform-modules-amd package is a plugin for Babel, a JavaScript compiler, that transforms ES2015+ modules to Asynchronous Module Definition (AMD) format. This is particularly useful for integrating modern JavaScript codebases with systems that require or benefit from the AMD module pattern, such as certain web browsers and JavaScript environments.

What are @babel/plugin-transform-modules-amd's main functionalities?

Transform ES Modules to AMD

This feature automatically converts ES2015+ import statements into AMD `define` calls, making it easier to integrate with AMD-based module systems.

import { sum } from './math';
console.log(sum(1, 2));
// Transforms to:
define(['./math'], function (_math) {
  console.log(_math.sum(1, 2));
});

Dynamic Import Support

Supports the transformation of dynamic `import()` syntax to AMD's `require` calls, enabling code splitting and lazy loading of modules in AMD environments.

import('./math').then(math => {
  console.log(math.sum(1, 2));
});
// Transforms to:
require(['./math'], function (math) {
  console.log(math.sum(1, 2));
});

Other packages similar to @babel/plugin-transform-modules-amd

@babel/plugin-transform-modules-commonjs

This package transforms ES2015+ modules to CommonJS modules, similar to how @babel/plugin-transform-modules-amd transforms modules to AMD format. It's useful for environments that support CommonJS modules, offering an alternative module system transformation.

@babel/plugin-transform-modules-umd

Similar to the AMD plugin, this Babel plugin transforms ES2015+ modules to Universal Module Definition (UMD) format. UMD modules are compatible with both CommonJS and AMD environments, making this plugin a versatile choice for projects that need to support multiple module systems.

@babel/plugin-transform-modules-systemjs

This plugin transforms ES2015+ modules to SystemJS format, another module loader system that can be used in the browser. It's an alternative to AMD for developers looking for dynamic loading and other advanced module loading features in the browser.

README

@babel/plugin-transform-modules-amd

This plugin transforms ES2015 modules to AMD

See our website @babel/plugin-transform-modules-amd for more information.

Install

Using npm:

npm install --save-dev @babel/plugin-transform-modules-amd

or using yarn:

yarn add @babel/plugin-transform-modules-amd --dev

Changelog

v7.17.12 (2022-05-16)

:bug: Bug Fix

• babel-plugin-transform-react-constant-elements
  • #14536 Never hoist JSX elts referencing vars from the current scope (@nicolo-ribaudo)
• babel-generator
  • #14524 fix: perserve parentheses of lhs id with rhs unamed fn (@JLHwung)
  • #14532 Print necessary parentheses for functions in postfix expressions (@xiawenqi)
• babel-plugin-transform-destructuring
  • #14494 Update scope info after destructuring transform (@peey)
• babel-parser
  • #14522 fix: allow liberal named type-as imports (@JLHwung)
• babel-parser, babel-plugin-transform-destructuring, babel-types
  • #14500 Fix parsing ts type casts and nested patterns in destructuring (@nicolo-ribaudo)

:house: Internal

• babel-plugin-proposal-decorators, babel-types
  • #14519 @babel/types builder improvements (@JLHwung)
• babel-core
  • #14490 Update to Jest 28 (@JLHwung)
• babel-core, babel-generator, babel-helper-create-class-features-plugin, babel-helper-create-regexp-features-plugin, babel-helper-module-transforms, babel-helper-plugin-utils, babel-parser, babel-plugin-bugfix-safari-id-destructuring-collision-in-function-expression, babel-plugin-bugfix-v8-spread-parameters-in-optional-chaining, babel-plugin-external-helpers, babel-plugin-proposal-async-do-expressions, babel-plugin-proposal-async-generator-functions, babel-plugin-proposal-class-properties, babel-plugin-proposal-class-static-block, babel-plugin-proposal-decorators, babel-plugin-proposal-export-default-from, babel-plugin-proposal-export-namespace-from, babel-plugin-proposal-function-sent, babel-plugin-proposal-json-strings, babel-plugin-proposal-logical-assignment-operators, babel-plugin-proposal-nullish-coalescing-operator, babel-plugin-proposal-object-rest-spread, babel-plugin-proposal-optional-chaining, babel-plugin-proposal-partial-application, babel-plugin-proposal-pipeline-operator, babel-plugin-proposal-private-methods, babel-plugin-proposal-private-property-in-object, babel-plugin-proposal-record-and-tuple, babel-plugin-proposal-unicode-property-regex, babel-plugin-syntax-decorators, babel-plugin-syntax-destructuring-private, babel-plugin-syntax-flow, babel-plugin-syntax-import-assertions, babel-plugin-syntax-pipeline-operator, babel-plugin-syntax-record-and-tuple, babel-plugin-syntax-typescript, babel-plugin-transform-arrow-functions, babel-plugin-transform-async-to-generator, babel-plugin-transform-block-scoping, babel-plugin-transform-classes, babel-plugin-transform-computed-properties, babel-plugin-transform-destructuring, babel-plugin-transform-duplicate-keys, babel-plugin-transform-flow-comments, babel-plugin-transform-flow-strip-types, babel-plugin-transform-for-of, babel-plugin-transform-instanceof, babel-plugin-transform-jscript, babel-plugin-transform-literals, babel-plugin-transform-modules-amd, babel-plugin-transform-modules-commonjs, babel-plugin-transform-modules-systemjs, babel-plugin-transform-modules-umd, babel-plugin-transform-named-capturing-groups-regex, babel-plugin-transform-new-target, babel-plugin-transform-parameters, babel-plugin-transform-property-mutators, babel-plugin-transform-proto-to-assign, babel-plugin-transform-react-constant-elements, babel-plugin-transform-react-jsx, babel-plugin-transform-reserved-words, babel-plugin-transform-runtime, babel-plugin-transform-spread, babel-plugin-transform-template-literals, babel-plugin-transform-typeof-symbol, babel-plugin-transform-typescript, babel-preset-env, babel-preset-flow, babel-preset-react, babel-preset-typescript, babel-traverse, babel-types
  • #14499 Provide plugin/preset typings from plugin-utils (@JLHwung)