vue项目打包后修改接口地址

我们在做vue项目时，总会遇到开发时用的测试地址和项目上线时用到的接口地址不同，再就是项目上线后，后期需要更改接口地址的情况。然而，如果没有一个配置文件，后期更换起来就只能修改vue文件然后再打包上线。这对于没有开发经验的运维人员来说，是有一定难度的。所以我们就要用到配置文件，直接修改配置文件，就可以修改。

我们在vue项目中，找到public文件夹，在public文件夹中创建一个config.js文件。
编辑config.js文件，将后端接口地址写在此文件中，因为此文件夹中文件打包不压缩，所以自定义全局变量，此文件不编译，因此需要用原生的写法
打开public文件夹中的index.html
.
script引用config.js文件
在vue页面文件中，console.log(config.src);即可在控制台中输出。

在使用这种方法配置后台接口地址，在打包后依然可以再次直接编辑config.js文件来修改接口地址。
各位同行小伙伴，如果在使用时遇到某些问题，可以评论讨论讨论。

vue项目打包后修改接口地址相关推荐

vue打包后修改接口地址(私有化部署)
私有化部署应用场景 1.客户对于软件交付物需要自己部署数据库和站点的情况. 2.一套软件通过修改某文件的方式(较低成本的更改),以达到调换接口的目的. 解决方案在vue项目中public文件夹下新 ...
vue项目打包后修改配置
前言在使用vue.js开发前端项目时,再结合webpack搞起各种依赖.各种插件进行开发,无疑给前端开发带来了很多便捷,就在解决跨域这个问题上,相信众多用vue.js的前端同僚们同我一样尝到了甜头, ...
vue项目打包后生成一个配置文件可以修改打包后的服务器api地址
vue项目打包后生成一个配置文件可以修改打包后的服务器api地址问题描述:vue项目打包上线之后,如果要改服务器api地址,只能在源码更改然后重新打包发布,为了解决这个问题,我们可以在static增 ...
打包后index.html路径错误,解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题...
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题 2018年05月23日 10:05:35 for_weber 阅读数:14179 Vue项目运行npm run buil ...
Vue项目打包后js文件压缩
前言这段时间因为免费试用了https://free.aliyun.com/一台阿里云的服务器,配置是 2核4G 2M, 因为带宽太低了,每次在第一次加载的时候太慢了,通过F12调试,发现主要是因为加 ...
electron+vue项目打包时修改注册表功能
electron+vue项目打包时修改注册表功能原因在使用electron做项目时,由于产品需要做一个放大镜功能.在查找了网上大部分类似需求后,发现大部分的放大镜都是对图片的放大,真正实现放大镜功 ...
(javascript)vue项目打包后，写的覆盖element的样式无效了。这是什么原因？
问题: (javascript)vue项目打包后,写的覆盖element的样式无效了.这是什么原因?描述: 在开发模式模式下,写的覆盖样式都有效,打包后就无效,请问下是什么原因? main.js里的c ...
快速解决Vue项目打包后文件过大问题
快速解决Vue项目打包后文件过大问题为什么打包后文件过大? 如何快速解决一.路由懒加载[使用es6提案的import()方式] 二.CDN引入为什么打包后文件过大? 移动app项目,使用vue- ...
接上一篇：【Vue 项目打包后访问报错：Uncaught TypeError: Cannot read property 'call' of undefined】
上一篇:Vue 项目打包后访问报错:Uncaught TypeError: Cannot read property 'call' of undefined 其实在修改 webpack.prod.co ...

vue项目打包后修改接口地址

vue项目打包后修改接口地址

vue项目打包后修改接口地址相关推荐

最新文章

热门文章