• 机构投资者应合理审慎报价 2019-07-16
  • “2018上影之夜”姜文等为“谢晋经典电影回顾展”揭幕 2019-07-10
  • 交大钱学森学院举行毕业典礼 14毕业生赴世界排名前百大学读研 2019-07-10
  • 西安市:构建“五方联动”社会治理新格局 2019-06-23
  • IP定向--云南频道--人民网 2019-06-23
  • 育儿十大坎 新手妈妈快快get起来 2019-06-21
  • 吉林:让更多农村孩子参加少年宫活动 2019-06-21
  • 美国发起贸易战,我们要让世界知道美元、美债并不可靠 2019-06-05
  • 紫光阁中共中央国家机关工作委员会 2019-05-31
  • 监察体制改革后 湘西半年72名公职人员主动交代问题 2019-05-12
  • 媒体宣传报道重庆日报 王国平:扮靓重庆两江四岸” 让城市有机更新 2019-04-26
  • 我相信“交警雨中护送高考生”是真,“交警雨中护送高考生”反被该高考生家长投诉是假。 2019-04-16
  • 14名消防员日巡逻28公里 洗冷水澡 2019-04-10
  • 靶壕有了“蓝军”,百发百中的“神枪手”练起来 2019-04-10
  • 不是秀强大了,别人就会来做朋友,这逻辑不对 2019-04-01
  • 频道栏目
    神奇公式秒杀全国11选5 > 程序开发 > web前端 > HTML/CSS > 正文
    Vue项目打包后动态获取自定义变量-前端技术-SegmentFault思否
    2019-05-11 22:05:10           
    收藏   我要投稿

    山西体彩11选5遗漏:1 前言

    1.1 业务场景

    神奇公式秒杀全国11选5 www.2zfa.com 一般使用 Vue 项目连接后端请求,使用的 axios

    import axios from 'axios'
    
    export const CMSAPI = axios.create({
      baseURL: "https://localhost:8080",
      timeout: 30000,
    });

    axios 中的 baseURL 一般是访问地址

    Vue 项目打包后,如果我们需要修改这个 baseURL 就需要修改代码重新 build

    这样就比较麻烦了

    有没有什么办法可以在Vue项目打包后再自定义变量呢?

    2 实现原理

    2.1 文件

    \

    目前使用新版 @vue/cli 创建的项目目录如上

    我们发现这个图标文件 favicon.ico 在打包文件中会单独存在

    类似,我们在这个文件夹中新建一个 index.js 文件

    2.2 代码

    index.js 文件中,我们直接定义一个变量

    //  index.js
    const apiURL = 'https://localhost:8080'
    //  index.html
    <script type="text/javascript" src="<%= BASE_URL %>index.js"></script>
    //  然后使用window对象
    window.apiURL = apiURL
    // axios中引用
    import axios from 'axios'
    
    export const CMSAPI = axios.create({
      baseURL: window.apiURL,
      timeout: 30000,
    });

    2.3 打包

    npm run build 后,会发现根目录中有我们定义的 index.js

    \

    这样我们就可以直接修改 index.js 中变量的值就可以啦

    3 后记

    感谢支持。若不足之处,欢迎大家指出,共勉。

    如果觉得不错,记得 点赞,谢谢大家 ??

    欢迎关注 我的: 【Github】 【掘金】 【简书】

    本文章采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。

    出处为:https://github.com/xrkffgg/Tools

    点击复制链接 与好友分享!回本站首页
    相关TAG标签
    上一篇:用JavaScript实现插入排序-疯狂的技术宅-SegmentFault思否
    下一篇:ES6专题—class与面向对象编程-体验javascript之美-SegmentFault思否
    相关文章
    图文推荐
    点击排行

    关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 神奇公式秒杀全国11选5

    版权所有: 神奇公式秒杀全国11选5--致力于做实用的IT技术学习网站

  • 机构投资者应合理审慎报价 2019-07-16
  • “2018上影之夜”姜文等为“谢晋经典电影回顾展”揭幕 2019-07-10
  • 交大钱学森学院举行毕业典礼 14毕业生赴世界排名前百大学读研 2019-07-10
  • 西安市:构建“五方联动”社会治理新格局 2019-06-23
  • IP定向--云南频道--人民网 2019-06-23
  • 育儿十大坎 新手妈妈快快get起来 2019-06-21
  • 吉林:让更多农村孩子参加少年宫活动 2019-06-21
  • 美国发起贸易战,我们要让世界知道美元、美债并不可靠 2019-06-05
  • 紫光阁中共中央国家机关工作委员会 2019-05-31
  • 监察体制改革后 湘西半年72名公职人员主动交代问题 2019-05-12
  • 媒体宣传报道重庆日报 王国平:扮靓重庆两江四岸” 让城市有机更新 2019-04-26
  • 我相信“交警雨中护送高考生”是真,“交警雨中护送高考生”反被该高考生家长投诉是假。 2019-04-16
  • 14名消防员日巡逻28公里 洗冷水澡 2019-04-10
  • 靶壕有了“蓝军”,百发百中的“神枪手”练起来 2019-04-10
  • 不是秀强大了,别人就会来做朋友,这逻辑不对 2019-04-01
  • 安徽25选5开奖视频 体彩江苏7位数18185期 排列五走势图2元网带坐标 ag真人官网 3d彩票走势图谜语 上海时时彩开奖记录 湖北11选5投注网站 平特怎么买 东方6十1最新开奖规则 七乐彩中两个号 中国福彩网375 3d彩票杀号 摇钱树四肖中特 广东好彩1最新开奖结果查询 梅西总进球数