Vue-cli 3.0 中如何配置axios跨域多个代理？

1、vue.config.js

  devServer: {
    open: true,
    port: 8081,
    proxy: {
            //匹配/dev-api开头的请求
            [process.env.VUE_APP_BASE_API]: {
                //目标服务器，代理访问到https://localhost:8080
                target: process.env.VUE_APP_SERVICE_URL,
                // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，
                // 并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
                changOrigin: true, //开启代理
                pathRewrite: {
                    // 会将 /dev-api 替换为 '',也就是 /dev-api 会移除，
                    // 如 /dev-api/db.json 代理到 https://localhost:8080/db.json
                    // '^/dev-api':"",
                    ["^" + process.env.VUE_APP_BASE_API]: ""
                }
            },
            //匹配/list-api开头的请求
            [process.env.VUE_APP_LIST_API]: {
                //目标服务器，代理访问到https://localhost:8080
                target: process.env.VUE_APP_LIST_URL,
                // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，
                // 并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
                changOrigin: true, //开启代理
                pathRewrite: {
                    // 会将 /list-api 替换为 '',也就是 /list-api 会移除，
                    // 如 /list-api/db.json 代理到 https://localhost:8080/db.json
                    // '^/list-api':"",
                    ["^" + process.env.VUE_APP_LIST_API]: ""
                }
            },
        }
  },

2、.env

# 使用 VUE_APP_ 开头的变量会被 webpack 自动加载
# 定义请求的基础URL, 方便跨域请求时使用

VUE_APP_BASE_API = '/dev-api'
VUE_APP_LIST_API = '/list-api'

# 接口服务地址， 以你自已的为主
# 可更改为你自已配置的 Easy-Mock 接口服务地址
# http://120.53.31.103:84/api

VUE_APP_SERVICE_URL = 'http://120.53.31.103:84/api/'
VUE_APP_LIST_URL = 'http://120.27.63.9:8080/'

3、api

export function test1(data) {
  return request({
    url: 'dev-api/test1',
    method: 'post',
    data,
  });
}
export function test2(data) {
  return request({
    url: 'list-api/test2',
    method: 'post',
    data,
  });
}