为了账号安全,请及时绑定邮箱和手机立即绑定

vue2.0项目使用webpack打包上线

vue2.0项目使用webpack打包上线

www说 2018-11-23 19:15:36
在开发vue项目时,由于在webpack中会产生跨域的问题,所以就在根目录下config文件的index.js子文件下修改了dev的proxyTable配置从而解决问题,但是到了打包上线的时候这些路径就会出现问题:例如:1、在index.js文件中配置:proxyTable:{    '/api': {    target: 'http://api.*******.cn',      changeOrigin: true,      pathRewrite: {      '^api':'api'    }  }}2、在vue某一个需要get/post的文件中使用vue-resourethis.$http.get('api/**/**/**/hello',...).then((res) => {...}).catch((err) => {...})结果是:1、在开发过程中使用dev命令可以解决跨域,但是打包之后该链接就不行了。问题:如果不用手动去该每一次this.$http.get的url,那么有什么办法可以解决咧?
查看完整描述

1 回答

?
隔江千里

TA贡献1906条经验 获得超10个赞

把所有的url提取出来放到一个单独的文件里(apis.js)然后统一控制apis.js一个文件就好。

然后在apis.js里用process.env.NODE_ENV === 'production'来区分是开发环境还是生产环境,分别export开发版本和生产版本的url就好。

补充

我在这补充吧,评论里说不清楚。

新建一个apis.js文件。

let ipath = (process.env.NODE_ENV === 'production') ? '/product' : '/api'


export const API_0 = ipath + '/**/**/**/hello'

export const API_1 = ipath + '/**/**/**/index'

然后,在需要用到接口的地方

someScript.js:

import {API_0} from '/apis.js'


this.$http.get( API_0 ,...).then((res) => {

...

}).catch((err) => {

...

})

这样就可以。

开发版本的代码API_0的值是/api/**/**/**/hello
正式环境的API_0的值是/product/**/**/**/hello

如果需要修改的话,只需要修改apis.js一个文件就可以了。


查看完整回答
反对 回复 2018-12-19
  • 1 回答
  • 0 关注
  • 1080 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号