前端本地代理N个后台的IP，如何不用每次更改编译

这个问题我想做前端的应该都遇到过，或许也已经有了解决的办法和途径，比如在vscode中使用alibaba cloud toolkit插件或者自己写个nginx处理等等，但我还是习惯每次自己更改配置中的proxy。原因这里就不说了。但这种每次都要重新编译真的是让人很烦躁，后来我突然去看了下配置代理的地方（从前只去改动target及后台的IP或域名）。在然后我就配置了多个，再然后每次跟某个人联调的时候只用更改更路径即可不用重新编译，这时间真的非常让人舒服。

好了，我们来看下基本的样子,

//在vue.config.js里
 proxy: {
      '/api': {
        target: 'http://192.168.1.112:8082/api', // 目前测试服务地址
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/houtai1': {
        target: 'http://192.168.1.113:8083/api', // 后台1本地地址
        changeOrigin: true,
        pathRewrite: {
          '^/houtai1': ''
        }
      },
    '/houtai2': {
        target: 'http://192.168.1.114:8084/api', // 后台2本地地址
        changeOrigin: true,
        pathRewrite: {
          '^/houtai2': ''
        }
      }
  }

无限配置你需要对接的后台联调ip，当然你还是要改接口请求的baseUrl的，改成你需要联调的代理地址即可，比如我要跟后台1联调，那baseUrl='/houtai1',这时你只用刷新下页面就好了，不用每次切换联调的IP重新编译