The error content is as follows:
says module not found babel-preset-es2015
.
Before the error was reported, I was modifying the code and using ElementUI’s on-demand import method to modify babel.config.js.
Note: @vue/cli scaffolding version 4 already uses babel7, so there is no .babelrc file in the project, replaced by babel.config.js.
My file configuration is as follows:
module.exports = {
presets: [
"@vue/cli-plugin-babel/preset",
["es2015", {
"modules": false }] // ElementUI按需引入配置
],
"plugins": [
// ElementUI 按需引入配置项
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
Steps given by ElementUI official website:
With the help of the plugin babel-plugin-component, we can introduce only the components we need to reduce the size of the project.
First, install babel-plugin-component:
npm install babel-plugin-component -D
Then configure .babelrc:
{
"presets": [["es2015", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
Current problem solution:
General "es2015"
Renovation "@babel/preset-env"
.
Why do we need to modify it like this? @babel/preset-env What kind of plug-in is it?
@babel/preset-env can provide syntax conversion according to the specified execution environment, that is, it can convert the updated js syntax into the syntax currently supported by the browser.
Official meaning:
It allows you to use the latest JavaScript syntax without having to worry about setting up corresponding syntax conversion plugins (and optional polyfills) for the syntax supported by the target environment.
Babel official document address <——Click it
The official documentation "Guide" for upgrading to Babel 7 points out:
In other words, the above default value has been deprecated in Babel 7, and should be directly replaced by @babel/preset-env
.
The reason why the above error is reported is because is deprecated in Babel 7. babel-preset-es2015
.
Reference text:@babel/preset-env