React 编译之后修改服务地址

news2024/9/21 8:03:13

编写react 的项目中,我们要调用后台服务的地址,当前后台服务器的地址在是写Axios相关的js文件中,

 但是项目我们在yarn build之后,变成了这样:

我们根本没有办法修改相关冯server_address,这样就产生了很大的局限性,在部署之前我们就需要知道ip,服务部署的端口,如果出现迁移,整个服务就需要重新进行打包

如何解决这样的问题

就是需要实现在我们部署之后,依然可以对相关的配置进行修改,可以这样,我们在public中增加一个config.js 因为打包之后,我们发现public中的相关文件是没有变化的

多以在public中增加:

并且我们在config.js中这样写路径:

 然后再Axios中这样使用路径:

 这样即使我们这边对项目进行打包,打包之后,我们通过修改config.js就能够实现对配置文件的修改和调整,

希望对你有所帮助! 

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/714423.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

24JS15——DOM

文章目录 一、DOM简介1、什么是DOM2、DOM树 二、获取元素1、如何获取页面元素2、根据id获取3、根据标签名获取4、通过HTML5新增的方法获取5、获取特殊元素body html 三、事件基础1、事件概述2、事件三要素3、执行事件的步骤 四、操作元素1、改变元素内容2、常用元素的属性操作3…

2017计算机学科夏令营上机考试

目录 A:判决素数个数【水题】 B:编码字符串(string)【水题】 C:岛屿周长(matrix)【深搜或者找规律】 D:Safecracker【深搜或者暴力不水】 E:怪盗基德的滑翔翼【动态规划】 F:Full Tank?【图论最短路/BFS优先队列】 G:实现堆结构 H:Subway(迪杰斯特拉算法&a…

理解ASEMI代理海矽美快恢复二极管SFP3012A的性能与应用

编辑-Z 在电子元件领域,快恢复二极管SFP3012A是一种重要的半导体器件,它在电路设计中扮演着至关重要的角色。本文将深入探讨SFP3012A的性能特点和应用领域,帮助读者更好地理解和使用这种二极管。 一、SFP3012A的性能特点 快恢复二极管SFP301…

4个在Pandas DataFrame中进行元素比较的函数

大家好,Pandas DataFrame是具有标记行和列的二维数据结构。 有时我们需要对两个DataFrame进行逐个元素的比较。例如: 使用另一个DataFrame的值来更新其中的值。 比较数值,并选择较大或较小的值。 本文将介绍四个不同的Pandas函数&#xf…

阿里前端常考vue面试题汇总

大厂面试题分享 面试题库 前后端面试题库 (面试必备) 推荐:★★★★★ 地址:前端面试题库 web前端面试题库 VS java后端面试题库大全 Vuex中actions和mutations有什么区别 题目分析 mutations和actions是vuex带来的两个独特…

MySQL原理探索——22 MySQL有哪些“饮鸩止渴”提高性能的方法

不知道你在实际运维过程中有没有碰到这样的情景:业务高峰期,生产环境的 MySQL 压力太大,没法正常响应,需要短期内、临时性地提升一些性能。 我做项目的时候,就偶尔会碰上这种场景。用户的开发负责人说,不管…

使用“Cocos引擎”创建的cpp工程如何在VS中调试Cocos2d-x源码

前段时间Cocos2d-x更新了一个Cocos引擎,这是一个集合源码,IDE,Studio这一家老小的整合包,我们可以使用这个Cocos引擎来创建我们的项目。 在Cocos2d-x被整合到Cocos引擎之前,我们可以不那么方便地在我们创建的工程里调…

SpringBoot 实现合并表头导出数据 - EasyExcel应用

文章目录 1. 构建实体类2. 导出3. 导入 EasyExcel是一款开源的Java处理Excel文件的工具库,它提供了简单易用的API,可以方便地读取、写入和操作Excel文件。下面是一些常见的EasyExcel应用场景: 读取Excel文件:使用EasyExcel可以轻…

阿里oss实现拖拽上传+二维码链接展示——技能提升

今天遇到一个需求,就是要实现拖拽上传文件,并调用渲染方法,将渲染后的链接通过二维码展示出来。 上一篇文章也是关于拖拽上传,但是接口是通过后端提供的上传方式来实现的,并非是直接调用阿里OSS来直接实现的。 1.拖拽…

月报总结|Moonbeam 6月份大事一览

本月,Moonbeam赢得第44轮Polkadot平行链插槽拍卖,在未来两年内都将保持活跃! 历时一个多月Moonbeam Bear Necessities Hackathon仍在如火如荼地进行着,从深入研究赛题的Workshop到解答疑惑的Office Hours,黑客松让BUI…

代码随想录算法训练营第七天 | 字符串基础系列1(反转字符串--反转字符串II--替换空格--反转字符串中的单词)

字符串基础系列1 344 反转字符串我的代码代码随想录的代码力扣的示例代码 541 反转字符串II我的代码代码随想录的代码力扣的示例代码 剑指offer-05 替换空格我的代码代码随想录的代码力扣的示例代码 151 反转字符串中的单词我的代码代码随想录的代码力扣的示例代码 一段用于复制…

电子时钟制作(瑞萨RA)(6)----配置RTC时钟及显示时间

概述 本文将详细讲解如何借助e2studio来对瑞萨微控制器进行实时时钟(RTC)的设置和配置,以便实现日历功能和一秒钟产生的中断,从而通过串口输出实时数据。 实时时钟(RTC)模块是一种时间管理外设&#xff0c…

部署深度学习APP的经历(docker,streamlit cloud,nuitka)

部署深度学习APP的经历 最近,接到一个部署深度学习APP的需求,这个APP使用torch、monai和pydicom等库构建了一个识别CT图像中皮下脂肪、内脏脂肪和骨骼肌,输入是CT图像,输出是识别的图像和相关数据。接手的时候,核心的算…

matlab将数据写入到excel中

第一种: 将数据转化为cell块,从A1单元格写起 % xlswrite(info_10*2.xls ,sheet1,B2:B4) clear; clc; a[1 2 3 4 5 6 ];%三组数据 b[11 22 33 44 55 66]; c[12 23 34 45 56 61]; data [a b c];%把数据保存到data中,其中a的表示转置 [m p]si…

PHP:提交表单之后出现本页面刷新的情况,导致路径参数消失

问题: 提交表单前 提交表单后 刷新之后,参数消失 解决办法 在提交表单的方法中写入代码携带参数的代码 样例: 实施 header(Location: table_detial.php?table_name.$table_name.);

Java Web JavaScript (2)23.7.2

5,BOM BOM:Browser Object Model 浏览器对象模型。也就是 JavaScript 将浏览器的各个组成部分封装为对象。 我们要操作浏览器的各个组成部分就可以通过操作 BOM 中的对象来实现。比如:我现在想将浏览器地址栏的地址改为 https://www.itheim…

m4a音频格式转换器:让音频轻松换装

大家有没有遇到这样的情况——你下载了一个很酷的音频文件,但是播放设备却说“不认识”这个格式?别担心!现在有个超级厉害的工具可以帮你解决这个问题,它就是m4a音频格式转换器!它能让你的音频文件变身,适应…

Java--基于Swing的登录界面

运行结果: 代码: import javax.swing.*; import java.awt.*; import java.awt.event.ActionEvent; import java.awt.event.ActionListener;public class ljt2 {public static void main(String[] args) {// 创建窗体JFrame frame new JFrame("学生信息管理系统");f…

数据处理及评分成果

文章目录 test.py界面展示 pf.pyfpga.py test.py import subprocess import os from PySide2.QtWidgets import QApplication, QMainWindow, QPushButton, QPlainTextEdit, QWidget, QLabel import mysql.connector from PySide2.QtGui import QPixmap, QPalette, QColorconn …

spfa求负环

1.虫洞 Wormholes&#xff08;裸spfa判断负环问题&#xff09; 信息学奥赛一本通&#xff08;C版&#xff09;在线评测系统 (ssoier.cn)http://ybt.ssoier.cn:8088/problem_show.php?pid1507 #include<bits/stdc.h> using namespace std; const int N510,M5210; int d…