devServer: {
   //端口配置
    port: '9080',
    open: true,
    //host: 'localhost',打開之后不能使用IP訪問項目
    proxy: {
      '/basic': {
        target: process.env.VUE_APP_BASE_API,//配置文件的請求url
        // target: 'http://10.31.126.172:9080',
        changeOrigin: true,
        ws: true,
        // pathRewrite: { '^/api': '' },
        onProxyRes(proxyRes, req, res) {
          //在控制臺顯示真實代理地址
          const realUrl = new URL(req.url || '',process.env.VUE_APP_BASE_API)?.href || ''
          proxyRes.headers['x-real-url'] = realUrl
        },
      },
    },
  },

module.exports = {
  // 其他配置
  ...... 
  // 代理配置
  devServer: {
    https: true, // 默認是false, 默認就是http協(xié)議，true將http協(xié)議轉換為https協(xié)議
    // 代理配置
    proxy: {
      '/api': { // 配置需要代理的路徑 --> 這里的意思是代理http://localhost:80/api/后的所有路由
        target: 'https://172.20.9.153:8085', // 目標地址 --> 服務器地址
        changeOrigin: true, // 允許跨域
        ws: true,  // 允許websocket代理
        // 如果這里沒有進行路徑重寫，當你訪問http://localhost:80/api/login/,實際上訪問的就是https://172.20.9.153:8085/api/login/
        pathRewrite: { // 重寫代理路徑
          // 就是把路徑中的api都替換為空的字符串
          '^/api': '', // 因為服務端地址里面是沒有api字段的，api只是為了區(qū)別需要代理的路徑，如果服務端有api字段則不需要重新    
        }
      }
    }
  }
}