Saltar al contenido principal

@babel/plugin-syntax-dynamic-import

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

información

Este plugin está incluido en @babel/preset-env, como parte de ES2020.

consejo

Puedes eliminar este plugin de tu configuración de Babel de forma segura si usas @babel/core 7.8.0 o superior.

Instalación​

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

Uso​

Mediante un archivo de configuración (Recomendado)​

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

Mediante la CLI​

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

Mediante la API de Node​

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

Trabajando con Webpack y @babel/preset-env​

Actualmente, @babel/preset-env no detecta que el uso de import() con Webpack depende internamente de Promise. Entornos sin soporte nativo para Promise, como Internet Explorer, requerirán añadir manualmente los polyfills tanto de promise como de iterator.

Por ejemplo, con 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"),
  ],
  // ...
};

o

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

// ...

Esto es igual para core-js@2, excepto que las rutas de importación son ligeramente diferentes:

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

o

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

// ...