vue @vue/cli3 配置代理proxy

文章参考

1. vue-cli 3.0版本，配置代理Proxy，不同环境不同target（生产环境，uat环境和本地环境的配置）
2. https://cli.vuejs.org/zh/config/#devserver-proxy

如何配置proxy

1. 在项目的跟目录下创建vue.config.js文件
2. 添加如下配置

module.exports = {
    outputDir: 'dist',  //build输出目录
    assetsDir: 'assets', //静态资源目录（js, css, img）
    lintOnSave: false, //是否开启eslint
    devServer: {
        open: true, //是否自动弹出浏览器页面
        host: "localhost", //表示启动的时候使用的域名，默认可以不写，则是使用localhost和本机IP
        port: '8081', // 设置端口号
        https: false,  //是否使用https协议
        hotOnly: false, //是否开启热更新
        proxy: {
            '/api': {
              target: 'http://yd.msword.top', //API服务器的地址
              ws: true, //代理websockets
              changeOrigin: true, // 是否跨域，虚拟的站点需要更管origin
              pathRewrite: {
                // '^/api5'是一个正则表达式，表示要匹配请求的url中，全部'http://localhost:8081/api5' 转接为 http://localhost:8081/api/
                '^/api5': '/api',
                //重写路径 比如'/api/aaa/ccc'重写为'/aaa/ccc'
                '^/api': '',
              }
            },
			'/foo': {
				target: 'http://yd.abc.top'
			}
        },
    }
}