一、Element-plus简介
Element plus是一套为开发者，设计师和产品经理准备的基于vue3.0的桌面端组件库。
之前在vue2中都使用element-ui，而element-plus是针对vue3开发的一个ui组件库。
二、基本使用
安装element-plus

npm install element-plus

2.1、全局引入
一种引入element-plus的方式是全局引入的方式，代表的含义是所有的组件和插件都会背自动注册。

import ElementPlus from 'element-plus'
import 'element-plus/theme-chalk/index.css'

const app = createApp(App)
app.use(ElementPlus)
app.mount('#app')

2.2、局部引入
也就是在开发中使用到某一个组件然后对其进行引入。

2.3、按需导入
首先你需要安装unplugin-vue-components 和 unplugin-auto-import这两款插件.

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

// 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 = {
  // ...
  plugins: [
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),
  ],
}

然后在main.ts中引入

import { createApp } from 'vue'
import App from './App.vue'

import router from './router/index'
import store from './store'
import { ElButton, ElInput } from 'element-plus/lib/components'

const app = createApp(App)
app.use(router)
app.use(store)
app.component(ElButton.name, ElButton)
app.component(ElInput.name, ElInput)
app.mount('#app')

如果组件太多此时我们应该新建一个文件，来将组件部分抽离出来