vue 中区分测试环境和正式环境
其实很简单,只要改动四个地方就行,不管你用的是vueResource或者anxios都可以1.在/config/dev.env.js 和/config/prod.env.js中分别这样修改/config/dev.env.js'use strict'const merge = require('webpack-merge')const prodEnv = require('./pr...
·
其实很简单,只要改动四个地方就行,不管你用的是vueResource或者anxios都可以
1.在/config/dev.env.js 和/config/prod.env.js中分别这样修改
/config/dev.env.js
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {//测试环境域名
NODE_ENV: '"development"',
API_ROOT: '"测试环境域名"'
})
/config/prod.env.js
'use strict'
module.exports = {//正式环境域名
NODE_ENV: '"production"',
API_ROOT: '"正式环境域名"'
}
2.然后再src目录下新建一个api/index.js
const root = process.env.API_ROOT;
export default root;
//把你的地址export出去,然后在main.js中全局引用
3.在main.js中全局引用
// 引用API文件
import api from './api/index.js' //切换环境js
// 将API方法绑定到全局
Vue.prototype.$api = api
4.在页面接口中这样使用
然后,npm run dev 调的就是测试环境地址
npm run build 调的就是正式环境地址
自己也是在网上找了很多方法,最后根据自己的实际应用把最简洁的步骤贴给大家,祝你们工作顺利,身体健康
更多推荐
已为社区贡献14条内容
所有评论(0)