区分环境进行按需加载，提升本地开发加载速度。

更改侧边栏活跃色，让其和element-ui皮肤统一。
修复issue https://github.com/flipped-aurora/gin-vue-admin/issues/1347

web/src/main.js

@@ -9,7 +9,6 @@ import auth from '@/directive/auth'
 import { store } from '@/pinia'
 import App from './App.vue'
 import { initDom } from './utils/positionToCode'
-
 import 'element-plus/theme-chalk/src/message.scss'
 import './style/element_visiable.scss'
 

web/src/pinia/modules/user.js

@@ -15,7 +15,7 @@ export const useUserStore = defineStore('user', () => {
     headerImg: '',
     authority: {},
     sideMode: 'dark',
-    activeColor: '#4D70FF',
+    activeColor: 'var(--el-color-primary)',
     baseColor: '#fff'
   })
   const token = ref(window.localStorage.getItem('token') || '')
@@ -123,10 +123,7 @@ export const useUserStore = defineStore('user', () => {
     }
   })
   const activeColor = computed(() => {
-    if (userInfo.value.sideMode === 'dark' || userInfo.value.sideMode === 'light') {
-      return '#4D70FF'
-    }
-    return userInfo.activeColor
+    return 'var(--el-color-primary)'
   })
 
   watch(() => token.value, () => {

web/src/style/element/index.scss

@@ -1,7 +1,24 @@
 @forward 'element-plus/theme-chalk/src/common/var.scss' with (
   $colors: (
+  'white': #ffffff,
+    'black': #000000,
     'primary': (
       'base': #4d70ff,
     ),
+    'success': (
+      'base': #67c23a,
+    ),
+    'warning': (
+      'base': #e6a23c,
+    ),
+    'danger': (
+      'base': #f56c6c,
+    ),
+    'error': (
+      'base': #f56c6c,
+    ),
+    'info': (
+      'base': #909399,
+    ),
   )
 );

web/src/style/element_visiable.scss

@@ -30,11 +30,6 @@
 }
 
 
-:root {
-    --el-color-primary: #4D70FF;
-    --el-menu-item-height:56px ;
-}
-
 .gva-search-box {
     padding: 24px;
     padding-bottom: 2px;

web/src/view/layout/aside/index.vue

@@ -58,7 +58,7 @@ const getTheme = () => {
     case '#fff':
       theme.value = {
         background: '#fff',
-        activeBackground: '#4D70FF',
+        activeBackground: 'var(--el-color-primary)',
         activeText: '#fff',
         normalText: '#333',
         hoverBackground: 'rgba(64, 158, 255, 0.08)',
@@ -68,7 +68,7 @@ const getTheme = () => {
     case '#191a23':
       theme.value = {
         background: '#191a23',
-        activeBackground: '#4D70FF',
+        activeBackground: 'var(--el-color-primary)',
         activeText: '#fff',
         normalText: '#fff',
         hoverBackground: 'rgba(64, 158, 255, 0.08)',

web/src/view/layout/index.vue

@@ -246,13 +246,4 @@ const changeShadow = () => {
 
 <style lang="scss">
 @import '@/style/mobile.scss';
-
-.dark{
-  background-color: #191a23 !important;
-  color: #fff !important;
-}
-.light{
-  background-color: #fff !important;
-  color: #000 !important;
-}
 </style>