vue 全局环境切换问题
2019-10-27 18:05
921 查看
前端开发经常碰到切换环境的情况,
测试环境,开发环境,正式环境(以及图片环境~~)
1.我们在utils中创建一个global.js文件
/** @Author: faith 全局常量对象 create by faith 2019-10-23 @return 全局常量对象 * export function global() { const localGlobal = { PORTAL: 'http://test.域名.com:1024', // 前台 CONSOLE: 'http://test.域名.com:9528', // 后台 SHOP: 'http://test.域名.com:1025', // 店铺 OSS_URL: 'https://devsfile.oss-cn-beijing.aliyuncs.com/' // 图片地址 } const devGlobal = { PORTAL: 'https://dev.域名.com', // 前台 CONSOLE: 'https://dev.console.域名.com', // 后台 SHOP: 'https://dev.shop.域名.com', // 店铺 OSS_URL: 'https://devsfile.oss-cn-beijing.aliyuncs.com/' // 图片地址 } const prodGlobal = { PORTAL: 'https://www.域名.com', // 前台 CONSOLE: 'https://console.域名.com', // 后台 SHOP: 'https://shop.域名.com', // 店铺 OSS_URL: 'https://ycsfile.oss-cn-beijing.aliyuncs.com/' // 图片地址 } return devGlobal }
2.main.js中使用
import { global } from './utils/global' Vue.prototype.$global = global() 3.vue 页面中使用img地址 data() { return { ossUrl: this.$global.OSS_URL, } },
4.Dom 结构
<img :src="ossUrl+后台传输url" class="avatar">
每次打包之前切换环境,是不是既方便又快捷啊
总结
以上所述是小编给大家介绍的vue 全局环境切换问题,希望对大家有所帮助!
您可能感兴趣的文章:
相关文章推荐
- 问题:在 windows servers 2003 环境下,安装了.NET 1.1 和 2.0 的版本后,IIS中居然找不到1.1和2.0的切换选项卡
- Windows下Vue开发环境搭建及相关问题
- vue-cli 搭建的项目处理不同环境下请求不同域名的问题
- vue安装环境过程出现的问题,以及解决方法。
- vue-resource中设置全局拦截器遇到的两个问题
- Java问题总结33之利用UUID生成全局唯一码(Scala环境运行)
- Linux环境下的python2和python3切换问题
- ios设备,在微信环境中,单页面程序(如:vue),页面分享问题
- 关于vue项目中全局引入一个 .scss文件的问题解决
- 解决webpack+vue环境中,接入vue-quill-editor所遇到的问题
- 从DOS切换到mysql:环境变量设置的问题
- 详解vue项目和普通项目如何解决开发环境与生产环境下的跨域问题
- 切换系统语音环境,进入联系人出现联系人无响应问题
- Vue-cli proxyTable 解决开发环境的跨域问题
- 搭建vue环境遇到的问题
- vue使用echarts出现tab切换宽度变窄问题
- 转:Vue-cli proxyTable 解决开发环境的跨域问题
- Vue-cli proxyTable 解决开发环境的跨域问题
- vue.cli脚手架全局安装问题。
- vue -(问题系列)节点Sass无法为您的当前环境找到绑定:OS X 64位和Node.js 8.x(遇到)