vue 使用axios 开发环境与生产环境同时设置代理与baseURL
vue.config.jsvue-cli 4.x中没有这个文件,在项目根目录下自己新建一个module.exports = {configureWebpack: {devServer: {proxy: {'/api': {target: 'http://xxx.xxx:8080/xxxxxx/', //设置你调用的接口域名和端口号changeOrigin: true, //这里设置是否跨域
·
vue.config.js
vue-cli 4.x中没有这个文件,在项目根目录下自己新建一个
module.exports = {
configureWebpack: {
devServer: {
proxy: {
'/api': {
target: 'http://xxx.xxx:8080/xxxxxx/', //设置你调用的接口域名和端口号
changeOrigin: true, //这里设置是否跨域
pathRewrite: { // 路径重写
'^/api': ''
}
}
}
}
},
};
main.js (或者其他文件下)
import axios from 'axios';
Vue.prototype["$http"]=axios;
/*设置baseURL*/
let baseURL = '/api';
// process.env.NODE_ENV 用于判断当前运行环境,根据 npm run serve 或 npm run build
if (process.env.NODE_ENV === 'production') {
baseURL = 'http://xxx.xxx:8080/xxxxxx/';
}
axios.defaults.baseURL = baseURL;
还有一种方式是,在根目录下创建两个文件
分别配置地址
然后使用
但是,这种方式我自己实测不行。生产环境能运行,自动化部署的线上环境不行。
大家可以尝试一下。
更多推荐
已为社区贡献1条内容
所有评论(0)