Element Plus 在Vue3.0按需导入

main.ts代码

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// Element Plus
import 'element-plus/lib/theme-chalk/index.css'
import { components, plugins } from './plugins/element'

// 创建App实例
const app = createApp(App) 

// 按需导入Element Plus组件和插件
components.forEach(component => {
  app.component(component.name, component)
})
plugins.forEach(plugin => {
  app.use(plugin)
})

app.use(store)
app.use(router)
app.mount('#app')

element.ts 代码

import {
  ElMenu,
  ElMenuItem,
  ElSlider,
  ElSubmenu,
  ElButton,
  ElMessageBox
} from 'element-plus'

export const components: any[] = [
  ElMenu,
  ElMenuItem,
  ElSlider,
  ElSubmenu,
  ElMenuItem,
  ElButton
]
export const plugins: any[] = [ElMessageBox]