更新

lixuliang

2024-09-14 c7187e038c284acc051a439c5eda16582bdb9b7a

 config/index.js

@@ -10,7 +10,6 @@
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},

    // Various Dev Server settings
    host: '0.0.0.0', // can be overwritten by process.env.HOST
@@ -19,7 +18,47 @@
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
    proxyTable: {
      // 这里配置 '/api' 就等价于 target , 你在链接里访问 /api === http://localhost:54321

      '/api': { // 请求的代称，写在Axios里的BaseUrl 
        target: 'http://localhost:8088/spring', // 真实请求的URL 后台接口域名
        ws: true, //  //如果要代理 websockets，配置这个参数
        secure: false,  // 如果是https接口，需要配置这个参数
        changeOrigin: true, // 允许跨域
        pathRewrite: { //替换，通配/api的替换成对应字符
          /* 重写路径，
              当我们在浏览器中看到请求的地址为：http://localhost:8080/api/core/getData/userInfo 时
              实际上访问的地址是 http://localhost:8088/spring/core/getData/userInfo,
              因为重写了/api
          */
          '^/api': ''        //当你的接口中没有/api字眼时，采用这种，直接替换成空即可
          // '^/api': '/api'   当你的接口中刚好有/api 时，采用这种方式
        }
      },
      '/api2': {
        target: 'http://10.10.4.121:8070',
        // secure: true, // 如果是 https ,需要开启这个选项
        changeOrigin: true, // 是否是跨域请求?肯定是啊,不跨域就没有必要配置这个proxyTable了.
        pathRewrite: { // 重写路径  例如浏览器请求地址http://localhost:12345/xxx,实际请求的是你代理的地址：http:xxx/11111
          // 这里是追加链接,比如真是接口里包含了 /api,就需要这样配置.
          '^/api': '/api', // 和下边两种写法，因人而异根据需求。
          // 等价于    /api + /api  ==  http://localhost:54321/api
          // 如果写为 '^/api' : '/'
          // 等价于   /api + /  ==  http://localhost:54321/
          // 这里的 /api ==  http://localhost:54321
        }
        // 首先，在ProxyTable模块中设置了‘/api’，target中设置服务器地址，也就是接口的开头那段地址，例如http://localhost:54321，
        // 然后我们在调用接口的时候，就可以全局使用/api，这时候/api的作用就相当于http://localhost:54321，
        // 比如接口的地址是http://localhost:54321/api/json.data，我们就可以使用/api/json.data

        // 那pathRewrite是用来干嘛的呢，这里的作用，相当于是替代/api，
        // 如果接口中是没有api的，那就直接置空，
        // 如果接口中有api，那就得写成{^/api:/api}，可以理解为一个重定向或者重新赋值的功能


      }
    },

    /**
     * Source Maps
@@ -27,29 +66,12 @@

    // https://webpack.js.org/configuration/devtool/#development
    devtool: 'cheap-module-eval-source-map',

    // If you have problems debugging vue-files in devtools,
    // set this to false - it *may* help
    // https://vue-loader.vuejs.org/en/options.html#cachebusting
    cacheBusting: true,

    cssSourceMap: true,
    proxyTable: {
      // 这里配置 '/api' 就等价于 target , 你在链接里访问 /api === http://localhost:54321
      '/api': {
        target: 'http://10.10.4.121:8070',
        // secure: true, // 如果是 https ,需要开启这个选项
        changeOrigin: true, // 是否是跨域请求?肯定是啊,不跨域就没有必要配置这个proxyTable了.
        pathRewrite: { // 重写路径  例如浏览器请求地址http://localhost:12345/xxx,实际请求的是你代理的地址：http:xxx/11111
          // 这里是追加链接,比如真是接口里包含了 /api,就需要这样配置.
          '^/api': '', // 和下边两种写法，因人而异根据需求。
          // 等价于    /api + /api  ==  http://localhost:54321/api
          // 如果写为 '^/api' : '/'
          // 等价于   /api + /  ==  http://localhost:54321/
          // 这里的 /api ==  http://localhost:54321
        }
      }
    }

  },

  build: {
@@ -66,7 +88,7 @@
     */


    

    productionSourceMap: true,//浏览器源代码可以看到
    // productionSourceMap: false,
    // https://webpack.js.org/configuration/devtool/#production