跳至主要内容

@babel/plugin-syntax-dynamic-import

信息

此插件包含在 @babel/preset-env 中，位于 ES2020。

提示

如果使用 @babel/core 7.8.0 或更高版本，您可以安全地从 Babel 配置中删除此插件。

安装​

npm install --save-dev @babel/plugin-syntax-dynamic-import

用法​

babel.config.json
{
  "plugins": ["@babel/plugin-syntax-dynamic-import"]
}

通过 CLI​

Shell
babel --plugins @babel/plugin-syntax-dynamic-import script.js

通过 Node API​

JavaScript
require("@babel/core").transformSync("code", {
  plugins: ["@babel/plugin-syntax-dynamic-import"],
});

使用 Webpack 和 @babel/preset-env​

目前，@babel/preset-env 不知道将 import() 与 Webpack 一起使用依赖于内部的 Promise。不支持 Promise 的环境（如 Internet Explorer）需要手动添加 promise 和 iterator polyfill。

例如，使用 core-js@3

webpack.config.js
const config = {
  entry: [
    "core-js/modules/es.promise",
    "core-js/modules/es.array.iterator",
    path.resolve(__dirname, "src/main.js"),
  ],
  // ...
};

或

src/main.js
import "core-js/modules/es.promise";
import "core-js/modules/es.array.iterator";

// ...

core-js@2 也是如此，只是导入路径略有不同

webpack.config.js
const config = {
  entry: [
    "core-js/modules/es6.promise",
    "core-js/modules/es6.array.iterator",
    path.resolve(__dirname, "src/main.js"),
  ],
  // ...
};

或

src/main.js
import "core-js/modules/es6.promise";
import "core-js/modules/es6.array.iterator";

// ...