1.安装element-plus ui

// NPM 安装
npm install element-plus --save

// Yarn安装
yarn add element-plus

2.完整引入

//完整引入element-plus
//在main.js中添加引入代码
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

//注册element-plus
.use(ElementPlus)

3.按需自动引入

3.1先安装两个自动引入插件unplugin-vue-components和unplugin-auto-import

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

3.2修改webpack配置，直接添加到vue.config.js配置文件

// vue.config.js
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

module.exports = defineConfig({
  //...
  //配置webpack自动引入elementPlus ui插件
  configureWebpack: {
    plugins: [
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
    ],
  }

  //...
})

3.3完成后直接在页面使用element-plus ui，无需引用和注册