current position:Home>When Vue adds on-demand loading to the UI library and starts the project, an error is reported in babel-preset-es2015

When Vue adds on-demand loading to the UI library and starts the project, an error is reported in babel-preset-es2015

2022-06-24 07:52:15Zhangxiaolang

Project use vue cli3 Scaffold tool construction
according to element As shown in the official documents .

npm install babel-plugin-component -D

Then add .babelrc file

{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

Report the following error :

Error: Cannot find module 'babel-preset-es2015' from 'C:\Users\Administrator\Des
ktop\vueProject\vuedemo'

The problem lies in the second step , I use vue3.0 Scaffolds built , only one babel-config.js Folder , But putting it in this folder will result in an error , So I created a new one in the project root directory .babelrc file , An error is found during operation es2015 What? , So it runs npm install babel-preset-es2015 --save-dev  install es2015.

The installation is completed or an error is reported :plugin/preset files are not allowed to export objects, only functions

resolvent :

1. install @babel/preset-env; Under project directory , Run command line
 

npm i @babel/preset-env -D

2. modify .babelrc file , hold es2015 Change to @babel/preset-env

{
  "presets": [["@babel/preset-env", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

3. Rerun events
Actually .babelrc Configuration item for , Can be written to babel.config.js In file , After that, you don't need to .babelrc The file

 

copyright notice
author[Zhangxiaolang],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2022/175/202206240328341851.html

Random recommended