vue前端代理跨域vue.config.js配置

前后端分离进行项目开发，前端需要做跨域代理才可以，后端弄也可以
主要配置 vue.config.js这个文件

代码如下：

module.exports = {
    publicPath: "/",
    outputDir: "dist",
    assetsDir: "static",
    lintOnSave: process.env.NODE_ENV === "development", // eslint-loader 是否在保存的时候检查
    productionSourceMap: false, //false 去掉打包的时候生成的map文件
    // filenameHashing: true, // 生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存
    devServer: {
        host: 'localhost',
        port: 8080,
        proxy: {
            '/visit':{//所有带/visit的都要去代理
                // 目标地址
                target:`http://localhost:8001`,
                // 发送请求头host会被设置target
                changeOrigin:true,
                //'^/visit'是一个正则表达式，表示要匹配请求的url中，http://XX.XX.XX.XX:8083/visit/login 转接为 http://XX.XX.XX.XX:8083/login
                pathRewrite:{
                    "^/visit":"/"
                }
            }
        },
        open: true,
        overlay: {
            warnings: false,
            errors: true
        }
    }
};

代理配置完成后，自己安装axios，自己进行相关的处理即可，我的处理如下：

import axios from "axios";

let base = "";
// 传送JSON格式的post请求
export const postRequest = (url, params) => {
  return axios({
    method: "post",
    url: `${base}${url}`,
    data: params
  });
};
//传递json的put请求
export const putRequest = (url, params) => {
  return axios({
    method: "put",
    url: `${base}${url}`,
    data: params
  });
};
//传递json的get请求
export const getRequest = (url, params) => {
  return axios({
    method: "get",
    url: `${base}${url}`,
    data: params
  });
};
//传递json的delete请求
export const deleteRequest = (url, params) => {
  return axios({
    method: "delete",
    url: `${base}${url}`,
    data: params
  });
};

调用的时候直接引用
例如：deleteRequest （‘路径’ + 参数).then(res => {})