vue2 startup project npm run dev reports an error Error: Cannot find module ‘babel-preset-es2015‘ Modification and cause of the problem

The error content is as follows:
Insert image description here

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

babel

The official documentation "Guide" for upgrading to Babel 7 points out:

Insert image description here

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

Guess you like

Origin blog.csdn.net/ThisEqualThis/article/details/129580500