Error in user YAML: (<unknown>): found character that cannot start any token while scanning for the next token at line 2 column 8
---
id: version-7.4.0-babel-plugin-syntax-dynamic-import
title: @babel/plugin-syntax-dynamic-import
sidebar_label: syntax-dynamic-import
original_id: babel-plugin-syntax-dynamic-import
---
npm install --save-dev @babel/plugin-syntax-dynamic-import
.babelrc
{
"plugins": ["@babel/plugin-syntax-dynamic-import"]
}
babel --plugins @babel/plugin-syntax-dynamic-import script.js
require("@babel/core").transform("code", {
plugins: ["@babel/plugin-syntax-dynamic-import"],
});
Currently, @babel/preset-env
is unaware that using import()
with Webpack relies on Promise
internally. Environments which do not have builtin support for Promise
, like Internet Explorer, will require both the promise
and iterator
polyfills be added manually.
For example, with core-js@3
:
// webpack config
const config = {
entry: [
"core-js/modules/es.promise",
"core-js/modules/es.array.iterator",
path.resolve(__dirname, "src/main.js"),
],
// ...
};
or
// src/main.js
import "core-js/modules/es.promise";
import "core-js/modules/es.array.iterator";
// ...
This is the same for core-js@2
, except the imports paths are slightly different:
// webpack config
const config = {
entry: [
"core-js/modules/es6.promise",
"core-js/modules/es6.array.iterator",
path.resolve(__dirname, "src/main.js"),
],
// ...
};
or
// src/main.js
import "core-js/modules/es6.promise";
import "core-js/modules/es6.array.iterator";
// ...