vue 全局环境切换问题
前端开发经常碰到切换环境的情况，
测试环境，开发环境，正式环境（以及图片环境~~）
1.我们在utils中创建一个global.js文件
/**
@Author:faith
全局常量对象
createbyfaith2019-10-23
@return全局常量对象
*
exportfunctionglobal(){
constlocalGlobal={
PORTAL:'http://test.域名.com:1024',//前台
CONSOLE:'http://test.域名.com:9528',//后台
SHOP:'http://test.域名.com:1025',//店铺
OSS_URL:'https://devsfile.oss-cn-beijing.aliyuncs.com/'//图片地址
}
constdevGlobal={
PORTAL:'https://dev.域名.com',//前台
CONSOLE:'https://dev.console.域名.com',//后台
SHOP:'https://dev.shop.域名.com',//店铺
OSS_URL:'https://devsfile.oss-cn-beijing.aliyuncs.com/'//图片地址
}
constprodGlobal={
PORTAL:'https://www.域名.com',//前台
CONSOLE:'https://console.域名.com',//后台
SHOP:'https://shop.域名.com',//店铺
OSS_URL:'https://ycsfile.oss-cn-beijing.aliyuncs.com/'//图片地址
}
returndevGlobal
}
2.main.js中使用
import{global}from'./utils/global'
Vue.prototype.$global=global()
3.vue页面中使用img地址
data(){
return{
ossUrl:this.$global.OSS_URL,
}
},
4.Dom结构
每次打包之前切换环境，是不是既方便又快捷啊
总结
以上所述是小编给大家介绍的vue全局环境切换问题，希望对大家有所帮助！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。