@babel/plugin-proposal-dynamic-import
2023-06-08 16:17 更新
NOTE: This plugin is included in @babel/preset-env, in ES2020.
Transforms import() expressions to non-ESM module formats.
When (not) to use this plugin
If you are using a bundler, such as Webpack, Rollup or Parcel, you should not use this plugin and let your bundler handle import() expressions.
You should use this plugin if:
- You are authoring a Node.js library in ESM but want to distribute it in CommonJS(CJS): Install this plugin and @babel/plugin-transform-modules-commonjs
- You use RequireJS to load modules in the browser: Install this plugin and @babel/plugin-transform-modules-amd
- You use SystemJS to load modules in the browser: Install this plugin and @babel/plugin-transform-modules-systemjs
This plugin must be used with one of the module transform plugins mentioned above.
Example
input.js
import("jquery").then($ => {});
will be transformed to
- CommonJS
- AMD
- SystemJS
output.js
Promise.resolve()
.then(() => _interopRequireWildcard(require("jquery")))
.then(($) => {});
Installation
- npm
- Yarn
- pnpm
pnpm add --save-dev @babel/plugin-proposal-dynamic-import
Usage
With a configuration file (Recommended)
babel.config.json
{
"plugins": [
"@babel/plugin-proposal-dynamic-import",
"@babel/plugin-transform-modules-commonjs"
]
}
Via CLI
Shell
babel --plugins=@babel/plugin-proposal-dynamic-import,@babel/plugin-transform-modules-amd script.js
Via Node API
JavaScript
require("@babel/core").transformSync("code", {
plugins: [
"@babel/plugin-proposal-dynamic-import",
"@babel/plugin-transform-modules-systemjs"
],
});
References
以上内容是否对您有帮助:
更多建议: