解决按照Element官网步骤按需引入组件运行时报错：Error: Cannot find module ‘babel-preset-es2015‘

全局注册element-ui及使用

安装
npm i element-ui -S

在main.js中全局注册组件，引入全局样式

// 引入 element组件库
import ElementUI from "element-ui";
// 
import "element-ui/lib/theme-chalk/index.css";
Vue.use(ElementUI);

之后就可以使用了…

主要讲解按需引入碰到的坑及报错。

按需引入

除了安装element-ui之外还要借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。

npm install babel-plugin-component -D

官方说的是直接在 .babelrc 文件夹下写入以下配置：

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

这个是可以的，但是你要注意自己的脚手架版本
按照官网步骤修改 .babelrc 文件时，注意：用vue脚手架创建的项目是找不到 .babelrc文件的，这是旧版本的脚手架才有的，新版本在vue脚手架创建的 babel.config.js 文件修改即可。

注意：如果是在 babel.config.js 文件下的话是写如下配置，如果是 .babelrc 文件要用上边的配置，两者是有区别的：

module.exports = {
    
    
  presets: [
    '@vue/cli-plugin-babel/preset',
    ["@babel/preset-env", {
    
     "modules": false }]
  ],
  plugins: [
    [
      "component",
      {
    
    
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

.babelrc 是这样：
babel.config.js 文件夹是这样：

原因是旧版本的脚手架用的是 es2015，新版本不再适用，而官网没有及时更新。
希望可以帮到大家…