vue-cli4引入element ui

vue-cli4引入element ui

按照官网文档按需引入出问题报错，如下可解决问题。引入出错解决仅用来自己记录问题！！！

官方文档链接: element-ui文档

安装element ui

npm i element-ui -S

main.js引入

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI)

添加 babel-plugin-component 依赖

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

npm install babel-plugin-component -D

配置 babel.config.js 文件

复制 plugins 的内容，打开 babel.config.js 文件配置如下

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

按需引入到模块中

以组件的形式按需引入