引入element-plus图标

package.json

@@ -8,6 +8,7 @@
     "serve": "vite preview"
   },
   "dependencies": {
+    "@element-plus/icons-vue": "^2.0.10",
     "aplayer": "^1.10.1",
     "axios": "^0.22.0",
     "echarts": "^5.2.1",

src/main.ts

@@ -11,11 +11,13 @@ const service = axios.create({
 })
 
 import { ElMessage, ElLoading } from 'element-plus'
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+
 
 // 添加请求拦截器
 service.interceptors.request.use(config => {
   // 在发送请求之前添加token到请求头
-  const token = app.$store.state.loginInfo.token
+  const token = mountedApp.$store.state.loginInfo.token
   if (token !== null && config.headers) {
     config.headers.token = token
   }
@@ -39,7 +41,7 @@ service.interceptors.response.use(res=> {
       ElMessage.warning(message)
     }
     if (err.response.status === 403) {
-      app.$router.push('/login')
+      mountedApp.$router.push('/login')
     }
   }
   return Promise.reject(err)
@@ -47,8 +49,8 @@ service.interceptors.response.use(res=> {
 
 // 全局路由导航前置守卫
 router.beforeEach(function (to, from, next) {
-  app.$store.commit('setBreadcrumb', routePathes[to.path] || [])
-  if(filterExclude.indexOf(to.path) !== -1 || app.$store.state.loginInfo.token) {
+  mountedApp.$store.commit('setBreadcrumb', routePathes[to.path] || [])
+  if(filterExclude.indexOf(to.path) !== -1 || mountedApp.$store.state.loginInfo.token) {
     next()
   } else {
     next('/login')
@@ -56,7 +58,11 @@ router.beforeEach(function (to, from, next) {
 })
 
 const app = createApp(App)
-  .use(router)
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+  app.component(key, component)
+}
+
+const mountedApp = app.use(router)
   .use(store)
   .use(VueAxios, service)
   .directive('loading', ElLoading.directive)

yarn.lock

@@ -25,7 +25,7 @@
   resolved "https://registry.yarnpkg.com/@ctrl/tinycolor/-/tinycolor-3.5.0.tgz#6e52b3d1c38d13130101771821e09cdd414a16bc"
   integrity sha512-tlJpwF40DEQcfR/QF+wNMVyGMaO9FQp6Z1Wahj4Gk3CJQYHwA2xVG7iKDFdW6zuxZY9XWOpGcfNCTsX4McOsOg==
 
-"@element-plus/icons-vue@^2.0.6":
+"@element-plus/icons-vue@^2.0.10", "@element-plus/icons-vue@^2.0.6":
   version "2.0.10"
   resolved "https://registry.yarnpkg.com/@element-plus/icons-vue/-/icons-vue-2.0.10.tgz#60808d613c3dbdad025577022be8a972739ade21"
   integrity sha512-ygEZ1mwPjcPo/OulhzLE7mtDrQBWI8vZzEWSNB2W/RNCRjoQGwbaK4N8lV4rid7Ts4qvySU3njMN7YCiSlSaTQ==