element-plus按需（自动）引用的配置方法_elementplusresolver

一、安装插件

npm install -D unplugin-vue-components unplugin-auto-import

二、配置vue.config.js

说明：官网直接复制的代码会报错.apply is not a valid Plugin property，需要configureWebpack:{ }包裹一层，这个意思就是在vue.config.js中配置webpack代码需要嵌套configureWebpack，最后打包的时候会整合的。

const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
 
module.exports = {
  configureWebpack: {
    plugins: [
      AutoImport({
        resolvers: [ElementPlusResolver()]
      }),
      Components({
        resolvers: [ElementPlusResolver()]
      })
    ]
  }
}

三、在main.js中引入css样式

说明：官网推荐全部引入

import 'element-plus/dist/index.css'

四、组件中就可以正常使用了