webpack 反向代理出現404

vue.config.js

devServer: {
   host: "localhost",
   port: 8080, // 端口號
   https: false, // https:{type:Boolean}
   open: true, //配置自動啟動瀏覽器
  // proxy: 'http://10.0.0.0' // 配置跨域處理,只有一個代理，寫上域名就可，不需要寫端口，端口在port中配置

   // 配置多個代理
    proxy: {
        "/api": {
              target: "http://10.2.0.1:80", // 要訪問的接口域名+端口
              ws: true, // 是否啟用websockets
               changeOrigin: true, //開啟代理：在本地會創建一個虛擬服務端，然后發送請求的數據，並同時接收請求的數據，這樣服務端和服務端進行數據的交互就不會有跨域問題
               pathRewrite: {
                    '^/api': '' 
                }
            }
       "/foo": { 
            // target: "<other_url>"
       // }
   }
}       

單個的配置沒有什么太大問題

主要是使用配置多個代理的時候，和后端本地調試，沒有問題，

放在了測試環境，接口報404，然而直接請求地址沒問題，telnet后端地址也是通的

問題：測試環境的接口不知道怎么設置網關什么的，總之就是后端接口也有一個前綴/api，而我恰恰也使用了api進行代理

解決1：既然這樣，我把api換成foo不就可以了，結果是 依然不行

繼續解決：搜索 pathRewrite 的作用 傳送門     https://blog.csdn.net/a460550542/article/details/84999036

解決：將pathRewrite整個對象刪除，不進行重寫，

問題解決

還是不了解webpack，解決了我也不知道為啥不用和后端一樣的前綴了，依然還是不行

如果有大佬知道，煩請指點