Error:Plugin/Preset files are not allowed to export objects, only functions 解决

在vue的官方文档下安装element-ui的按需加载时会有这么一个错误。

Error:Plugin/Preset files are not allowed to export objects, only functions

在element官方文档中

按需引入

借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。

首先，安装 babel-plugin-component：

npm install babel-plugin-component -D

然后，将 .babelrc 修改为：

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

这时根据官方的文档安装并且配置完成后，npm run serve启动时还会报错

Error: Cannot find module 'babel-preset-es2015'

这是因为缺少 babel-preset-es2015 这个依赖

只需安装一下这个babel-preset-es2015 依赖

npm i babel-preset-es2015 --save

这样就可以了，但有时候你安装了之后启动时还是会报错

Error: Plugin/Preset files are not allowed to export objects, only functions.

我在这是把 项目中babel.config.js文件中的预设给换了一下   没有使用element-ui官方文档上的

es2015，而是把babel.config.js内容更改为一下内容：

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

然后在命令行中安装一下依赖

npm install --save-dev @babel/preset-env

这样就解决了这个错误。

如果你对这个不是了解，请参考Babel的文档