关于element-ui:Elementvuecli4配置elementui按需引入

参考地址：《Vue-cli4 配置 element-ui 按需引入》

装置完element-ui后，如果残缺引入，不按需加载其组件，打出的包会很大，这很影响性能。

上面，依照官网的教程，咱们来操作一下，如何配置element-ui按需加载组件。

首先要增加babel-plugin-component依赖，代码如下：

npm install babel-plugin-component -D

上面就该写plugins配置项了，这就是重点了，依照官网的教程，肯定会失败，因为官网是依照vue-cli@3写的，在vue-cli@4环境下，咱们须要批改babel.config.js文件，代码如下：

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

之后就是在main.js中按需引入组件了，示例代码如下：

import Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'import {  Dialog,  Table,  TableColumn,  Tag,  Container,  Header,  Main,  Row,  Col} from 'element-ui'Vue.use(Dialog)Vue.use(Table)Vue.use(TableColumn)Vue.use(Tag)Vue.use(Container)Vue.use(Header)Vue.use(Main)Vue.use(Row)Vue.use(Col)Vue.config.productionTip = falsenew Vue({  router,  store,  render: h => h(App)}).$mount('#app')

—完—