新建vue.config.js文件(此文件跟src文件夹同级)
然后加入以下代码
module.exports = {
devServer: {
proxy: {
/*
此处的斜杠可以改成任何前缀
*/
'^/': {
target: '需要代理的接口地址',
changeOrigin: true,
pathRewrite: {
/*
此处的^/要跟上面的对应,这一步是要重写url的地址
*/
'^/': '/'
}
},
}, // string | Object
before: app => {}
},
}
然后在main.js中修改配置
/*
这一步是区分开发环境跟生产环境,如果是线上环境就用域名,本地环境就默认斜杠
*/
axios.defaults.baseURL = process.env.NODE_ENV == 'development' ? '/' : '线上接口地址的域名';
当然,在某些情况下你或许需要配置多个代理
如果是多个代理
module.exports = {
devServer: {
proxy: {
/*
此处的斜杠可以改成任何前缀
*/
'^/aaa': {
target: '需要代理的接口地址',
changeOrigin: true,
pathRewrite: {
/*
此处的^/要跟上面的对应,这一步是要重写url的地址
*/
'^/aaa': '/'
}
},
'^/bbb': {
target: '需要代理的接口地址',
changeOrigin: true,
pathRewrite: {
/*
此处的^/要跟上面的对应,这一步是要重写url的地址
*/
'^/bbb': '/'
}
},
}, // string | Object
before: app => {}
},
}
这么写即可