摘要:若不足之处,欢迎大家指出,共勉。如果觉得不错,记得点赞,谢谢大家
1 前言 1.1 业务场景
一般使用 Vue 项目连接后端请求,使用的 axios
import axios from "axios" export const CMSAPI = axios.create({ baseURL: "http://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 = "http://localhost:8080"
// index.html // 然后使用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 后记感谢支持。若不足之处,欢迎大家指出,共勉。
如果觉得不错,记得 点赞,谢谢大家
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/110236.html
摘要:注意此处获取的数据是更新后的数据,但是获取页面中的元素是更新之前的钩子函数说明组件已经更新,所以你现在可以执行依赖于的操作。钩子函数说明实例销毁 Vue -渐进式JavaScript框架 介绍 vue 中文网 vue github Vue.js 是一套构建用户界面(UI)的渐进式JavaScript框架 库和框架的区别 我们所说的前端框架与库的区别? Library 库,本质上是一...
阅读 3828·2021-10-08 10:12
阅读 4324·2021-09-02 15:40
阅读 933·2021-09-01 11:09
阅读 1604·2021-08-31 09:38
阅读 2542·2019-08-30 13:54
阅读 2248·2019-08-30 12:54
阅读 1242·2019-08-30 11:18
阅读 1398·2019-08-29 14:06