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(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。