路由及缓存优化

package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
+    "build:stage": "vue-cli-service build --mode staging",    
     "lint": "vue-cli-service lint",
     "predeploy": "yarn build",
     "deploy": "gh-pages -d dist -b pages -r https://gitee.com/iczer/vue-antd-admin.git",

src/components/setting/Setting.vue

@@ -126,6 +126,7 @@ import {setting} from '@/config/default'
 import sysConfig from '@/config/config'
 import fastEqual from 'fast-deep-equal'
 import deepMerge from 'deepmerge'
+import {getLocalStorage, setLocalStorage, removeLocalStorage} from '@/utils/cache'
 
 const ColorCheckboxGroup = ColorCheckbox.Group
 const ImgCheckboxGroup = ImgCheckbox.Group
@@ -162,7 +163,7 @@ export default {
       let clipboard = new Clipboard('#copyBtn')
       clipboard.on('success', () => {
         this.$message.success(`复制成功，覆盖文件 src/config/config.js 然后重启项目即可生效`).then(() => {
-          const localConfig = localStorage.getItem(process.env.VUE_APP_SETTING_KEY)
+          const localConfig = getLocalStorage(process.env.VUE_APP_SETTING_KEY)
           if (localConfig) {
             console.warn('检测到本地有历史保存的主题配置，想要要拷贝的配置代码生效，您可能需要先重置配置')
             this.$message.warn('检测到本地有历史保存的主题配置，想要要拷贝的配置代码生效，您可能需要先重置配置', 5)
@@ -174,14 +175,14 @@ export default {
     saveSetting() {
       const closeMessage = this.$message.loading('正在保存到本地，请稍后...', 0)
       const config = this.extractConfig(true)
-      localStorage.setItem(process.env.VUE_APP_SETTING_KEY, JSON.stringify(config))
+      setLocalStorage(process.env.VUE_APP_SETTING_KEY, JSON.stringify(config))
       setTimeout(closeMessage, 800)
     },
     resetSetting() {
       this.$confirm({
         title: '重置主题会刷新页面，当前页面内容不会保留，确认重置？',
         onOk() {
-          localStorage.removeItem(process.env.VUE_APP_SETTING_KEY)
+          removeLocalStorage(process.env.VUE_APP_SETTING_KEY)
           window.location.reload()
         }
       })

src/config/config.js

@@ -5,6 +5,7 @@ module.exports = {
     mode: 'dark',
   },
   multiPage: true,
+  asyncRoutes: true,
   animate: {
     name: 'lightSpeed',
     direction: 'left'

src/pages/exception/403.vue

@@ -1,5 +1,5 @@
 <template>
-  <exception-page home-route="/dashboard/workplace" :style="`min-height: ${minHeight}`" type="403" />
+  <exception-page home-route="/" :style="`min-height: ${minHeight}`" type="403" />
 </template>
 
 <script>

src/pages/exception/404.vue

@@ -1,5 +1,5 @@
 <template>
-  <exception-page home-route="/dashboard/workplace" :style="`min-height: ${minHeight}`" type="404" />
+  <exception-page home-route="/" :style="`min-height: ${minHeight}`" type="404" />
 </template>
 
 <script>

src/pages/exception/500.vue

@@ -1,5 +1,5 @@
 <template>
-  <exception-page home-route="/dashboard/workplace" :style="`min-height: ${minHeight}`" type="500" />
+  <exception-page home-route="/" :style="`min-height: ${minHeight}`" type="500" />
 </template>
 
 <script>

src/pages/login/Login.vue

@@ -75,9 +75,9 @@
 
 <script>
 import CommonLayout from '@/layouts/CommonLayout'
-import {login, getRoutesConfig} from '@/services/user'
+import {login, logout} from '@/services/user'
 import {setAuthorization} from '@/utils/request'
-import {loadRoutes} from '@/utils/routerUtil'
+import {initRoutes} from '@/utils/routerUtil'
 import {mapMutations} from 'vuex'
 
 export default {
@@ -104,6 +104,7 @@ export default {
           this.logging = true
           const name = this.form.getFieldValue('name')
           const password = this.form.getFieldValue('password')
+          logout()
           login(name, password).then(this.afterLogin)
         }
       })
@@ -118,10 +119,8 @@ export default {
         this.setRoles(roles)
         setAuthorization({token: loginRes.data.token, expireAt: new Date(loginRes.data.expireAt)})
         // 获取路由配置
-        getRoutesConfig().then(result => {
-          const routesConfig = result.data.data
-          loadRoutes(routesConfig)
-          this.$router.push('/dashboard/workplace')
+        initRoutes(() => {
+          this.$router.push('/')
           this.$message.success(loginRes.message, 3)
         })
       } else {