资讯专栏INFORMATION COLUMN

vue开发微信商城项目总结之三--根据不同的开发环境做配置

Magicer / 3226人阅读

摘要:项目是基于搭建,项目分为开发环境,测试环境,预生产环境,生产环境,其中开发环境和测试环境调用同一个接口,开发环境调用服务器端的测试接口会跨域,以上需求就引发了一些问题,问题一测试环境包括开发环境,并且开发环境跨域,预生产环境,生产环境,有

项目是基于vue-cli搭建,项目分为开发环境,测试环境,预生产环境,生产环境,其中开发环境和测试环境调用同一个接口,开发环境调用服务器端的测试接口会跨域,以上需求就引发了一些问题,

问题一:
测试环境(包括开发环境,并且开发环境跨域),预生产环境,生产环境,有着不同的接口地址,也就是不同的开发环境要调用不同的接口地址,有的时候不同的开发环境还要调用不同的全局变量。

问题二:
本地开发环境跨域,本地开发环境调用服务器端接口地址,会跨域,但是代码打包上传到服务器,不会跨域
之前的解决方案(没有依赖webpack):
开发环境下,在static下新建一个config文件夹,再新建一个config.js,这是开发版的config,里面包含了开发和测试的接口地址和全局变量,并在index.html中手动引入(static中的文件不被webpack管理)如下

将config文件夹上传到测试服务器,开发环境打包后,将index.html中的config.js的路径更改为服务器端的config.js,如下

同理,预生产环境,生产环境,和测试环境一样,分别配置不同的config文件,也就是接口地址和全局变量,打包后更改压缩后的index.html

这样配置带来了很多问题和不便,要配置不同的config接口道不同的服务器,打包后需要手动修改config路径,但是也有一个好处,打包一次,三个环境可以共用,因为config接口在服务器端
以上是开发过程中,遇到的问题,
后来了解了一下webpack,发现vue-cli中有解决方案,研究一下并做了一下修改,脚手架地址

根据不同的环境调用不同的接口

vue开发微信商城项目总结之一--项目介绍
vue开发微信商城项目总结之二--Eslint配置

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/91925.html

相关文章

  • vue发微商城项目总结之四--本地代理处理跨域问题

    摘要:关于项目的基本描述,参见开发微信商城项目总结之一项目介绍开发微信商城项目总结之二配置开发微信商城项目总结之三根据不同的开发环境做配置之前处理跨域问题是通过,但是只有开发环境是跨域的,代码打包后上传到服务器便不再跨域,所以在本地做了判断,判断 关于项目的基本描述,参见 vue开发微信商城项目总结之一–项目介绍 vue开发微信商城项目总结之二–Eslint配置 vue开发微信商城项目总结之...

    Leck1e 评论0 收藏0
  • vue发微商城项目总结之五--vue实现九宫格抽奖

    摘要:根据产品提出的需求,需要做一个抽奖活动页面需求简介九宫格抽奖,中奖概率可配置,以九宫格转盘的形式进行抽奖,奖品分为三类,实物类奖品,收货人信息可编辑,默认为登陆用户,可生成订单福币类奖品,直接发放,可在交易明细中查看优惠劵类奖品,交易明细中 根据产品提出的需求,需要做一个抽奖活动页面 需求简介 九宫格抽奖,中奖概率可配置,以九宫格转盘的形式进行抽奖,奖品分为三类, 实物类奖品,收货人...

    CoorChice 评论0 收藏0
  • vue发微商城项目总结之六--关于vuex思考

    先对项目进行一下简单的介绍 vue开发微信商城项目总结之一–项目介绍 项目开发初期,由于项目比较着急上线,前端的框架在选型上比较仓促,只是因为vue学习成本较低,就选了它,没有什么别的原因, 之前看过angular2一段时间,又趁着周末看了两天vue,就仓促开发,所以埋下了很多坑,项目(项目目前没有对游客开放,是2B2C的模式)上线后,回头填坑,发现了很多问题,因为之前一直是基于Jquery模式的...

    PrototypeZ 评论0 收藏0
  • 使用vue发微公众号下SPA站点填坑之旅

    摘要:原文见我的博客,点击进入使用开发微信公众号下站点的填坑之旅本文为我创业过程中,开发项目的填坑之旅。作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱。 原文见我的博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅。作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^_^。 ...

    yeyan1996 评论0 收藏0
  • 多享发微商城有哪些步骤?

    摘要:公众号微商城开发的过程,一般会经过了上述个进程,那么整个微商城开发的进程基本上也就完成了,所以我们能够依据实际情况来进行全面开发。 微商城开发有哪些步骤?公众号微商城开发的进程傍边,多多少少的也要遵循着自己的流程,从现有的一些情况来看,大多数的情况下再开发的进程傍边参加着各种不同的开发计划,那么他们的流程究竟如何?   制造解决计划  在进行公众号微商城开发的进程傍边,自身要做的也就是...

    keelii 评论0 收藏0

发表评论

0条评论

Magicer

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<