Ant design vue pro食用心得（长期编写）

0x1 禁用Mock，使用后台数据交互

配置服务器代理

1、 修改vue.config.js文件

devServer: {
    // development server port 8000
    port: 8080,
    // https: true,
    // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
    proxy: {
      // request.js中创建axios实体时baseURL的值为Key
      '/api': {
        target: 'https://auth.e-clouds.net/',
        ws: false,
        changeOrigin: true,
        secure: true
      },
      '/platform': {
        target: 'https://platformapi.e-clouds.net/',
        ws: false,
        changeOrigin: true,
        secure: false,
        // URL替换，使API的URL正确的匹配服务器的调用URL
        pathRewrite: {
          '^/platform': '/api'
        }
      }
    }
  },

2、 修改main.js文件
将一下代码注释

import './mock'

切断权限路由请求，去除权限控制，保留token验证

1、 修改permission.js文件
注释成功取得Token后的权限验证代码，排除相应的错误
获取Token失败后首先进行Token续签，失败则返回登录页面，成功跳转到后续页面

permission.js文件调整方法

第25行中为权限选规则判断，因为权限控制已经全部去除，故可以删除，并替换成相应判断

if (store.getters.userpack) {
    // 页面跳转逻辑
    // 请求带有 redirect 重定向时，登录自动重定向到该地址
    const redirect = decodeURIComponent(from.query.redirect || to.path)
    // console.log(redirect)
    if (to.path === redirect) {
      // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
      next()
    } else if (to.path !== defaultRoutePath) {
      next()
    } else {
      // 跳转到目的路由
      next({ path: redirect })
    }
} else {
	// 重新获取用户包，并执行页面跳转逻辑
}

开放主题设置

修改layouts中的BasicLayout.vue中L56

<!-- <setting-drawer v-if="!production"></setting-drawer> -->
<setting-drawer></setting-drawer>

构建方式调整为：

npm run build:preview