组件按需加载

src/main.js

@@ -2,25 +2,67 @@ import { createApp } from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
-import ElementPlus from 'element-plus'
+// import ElementPlus from 'element-plus'
+// import { ElButton, ElInput } from 'element-plus'
+
+import {
+  ElButton,
+  ElInput,
+  ElSelect,
+  ElOption,
+  ElLoading,
+  ElCheckbox,
+  ElCheckboxGroup,
+  ElCarousel,
+  ElCarouselItem,
+  ElBadge,
+  ElDropdown,
+  ElPopover,
+  // 其他需要的组件
+} from 'element-plus'
+
+import 'element-plus/theme-chalk/index.css'
 import 'element-plus/dist/index.css'
 import 'element-plus/lib/locale/lang/zh-cn'
+import 'element-plus/theme-chalk/index.css'
+
 import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
 import api from "./utils/api";
 
 //引入封装Axios请求
 import Axios from '@/utils/axios';
 
-const app = createApp(App)
-api.index().then(res => {
-    if (res.code === 200) {
-      store.state.seachTypeData = res.data.combination
-      store.state.indexData = res.data
-      store.state.ListSelectBtn = res.data.recommendedTab
-      console.log(store.state.seachTypeData)
-    }
-  })
-app.use(store).use(router).use(Axios).use(ElementPlus, {
-    locale: zhCn
-}).mount('#app')
+
+api.index().then(res => {
+  if (res.code === 200) {
+    store.state.seachTypeData = res.data.combination
+    store.state.indexData = res.data
+    store.state.ListSelectBtn = res.data.recommendedTab
+    store.state.user = res.data.user
+    store.state.nav = res.data.nav
+    console.log(store.state.seachTypeData)
+  }
+})
+
+
+const app = createApp(App)
+
+app.use(ElButton)
+app.use(ElInput)
+app.use(ElSelect)
+app.use(ElOption)
+app.use(ElLoading)
+app.use(ElCheckbox)
+app.use(ElCheckboxGroup)
+app.use(ElCarousel)
+app.use(ElCarouselItem)
+app.use(ElBadge)
+app.use(ElDropdown)
+app.use(ElPopover)
+
+
+app.use(store).use(router).use(Axios).mount('#app')
+// app.use(store).use(router).use(Axios).use(ElementPlus, {
+//   locale: zhCn
+// }).mount('#app')