axios请求本地的json文件在打包部署到子目录域名下,路径找不到

前言:

  因为要同时部署两个项目,有一个是部署到域名下面的子目录下,如:https://xxx.com/siot-admin

  vue 项目中使用axios请求了本地项目的static文件夹下的json文件,使用npm run build 打包后,json文件请求不到报404:

  

  

解决办法:      

Vue-cli打包后部署到子目录下路径问题

举例,若需要部署到www.***.com/catalog1/catalog2/下,需要更改

  1. config/index.js文件中,buildassetsPublicPath属性为'/catalog1/catalog2/',如下:

build: {
assetsPublicPath: '/catalog1/catalog2/', 

  默认情况下该值为'/'(该属性目测是webpack打包时的文件引用路径的基础路径,一级域名下这里应该写成“./”)。

  2.修改路由base属性为'/catalog1/catalog2/',如下:

export default new Router({// mode: 'history',base: '/catalog1/catalog2/',  //这个一定要加上routes: [{path: '/',name: 'indexContent',component: indexContent}]
})

其中mode设置为'history'可清除路径中的#(本地测试有效)。
设置完成后重新打包。

 

问题二: static里面的 font字体在打包后也找不到了

这个字体文件报404

解决办法:

在build/utils文件中的下图所示位置添加../../公共路径   

这样打包的iconfont字体文件路径时就会加上../../了。引用就没问题了。而不再需要手动更改css文件中的路径。 

 

 

转载于:https://www.cnblogs.com/mmzuo-798/p/10322773.html

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

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

相关文章

中国集成电路设计产业创新发展的认识和思考

来源:半导体行业观察 7月15日—16日,2021中国集成电路设计创新大会暨IC应用博览会在苏州召开。在本次大会高峰论坛上,中国集成电路设计创新联盟专家组组长、东南大学首席教授、南京集成电路产业服务中心(ICisC)主任、…

计算机网络(三)-体系结构

一.分层结构 1.分层的基本原则 各层之间相互独立,每层只实现一种相对独立的功能。每层之间界面自然清晰,易于理解,相互交流尽可能少。结构上可分割开,每层都采用最适合的技术来实现。保持下层对上层的独立性,上层单向…

基于SpringBoot项目的https

基于SpringBoot项目的https 在spring中配置项目运行的端口很简单。 在application.properties中 server.port: 8080 这样配置后,spring boot内嵌的tomcat服务器就是跑在8080端口启动http服务。但是如果在配置中启动https服务,用到的端口也是server.port。…

数年沉寂之后,VR/AR产业开始起飞!

来源:先进制造业现在,“新基建”已成为拉动投资、促进消费、稳定就业和提升综合实力的重要抓手,如何加载高质量的业务生态成为释放新基建发展动能的关键。当前,以虚拟现实VR(包含增强现实AR)为代表的未来视…

计算机网络(四)-奈氏准则和香农公式

一.奈氏准则 1.失真 1.1 在现实中信道,受到带宽限制,噪声,干扰等的影响,使信号失真。 1.2 影响失真程度的因素: 码元传输速率信号传输距离噪声干扰传输媒体质量 1.3 失真的一种现象------码间串扰 1)对于低频信号&…

珍藏版:3万字详解mRNA疫苗

来源:周观宇论撰文:邓周宇摘要新冠疫情的持续凸显了疫苗的重要性以及全球对疫苗的迫切需求。借此契机,mRNA疫苗登上了舞台,并以极高的保护率成为所有新冠疫苗种类中热度最高的C位选择。本报告介绍分析了mRNA疫苗相较于其他技术路径…

计算机网络(五)-物理层

一.物理层 1.基本概念 1.1 物理层解决如何在连接各种计算机的传输媒体上传输数据比特流,而不是指具体的传输媒体。 1.2 物理层主要任务:确定与传输媒体接口有关的一些特性,即定义标准。 机械特性:定义物理连接的特性&#xff0c…

从脑瘫患者重获交流到免开颅微创,脑机接口更安全了吗?

来源:燕良脑机接口技术作为一项前沿而又酷炫的技术,一直备受瞩目,近日,脑机接口技术取得了高价值进展,从大脑活动中解码完整句子,使得瘫痪失语者可以交流,让很多人看到了曙光。该项目是Facebook…

计算机网络(六)-传输介质

一.传输介质 1.1 传输介质也称传输媒体/传输媒介,它就是数据传输系统中在发送设备和接收设备之间的物理通路。 1.2 传输媒体并不是物理层。传输媒体在物理层的下面,因为物理层是体系结构的第一层,因此有时称传输媒体为第0层。 1.3 传输媒体…

SpringBoot项目中,Redis的初次使用

1.引入Redis依赖包&#xff0c;在application.yml中配置redis <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency> Spring:redis:host: 192.168.1.105port: …

AI不会很快取代作家——但未来可能比你想象的更近

来源&#xff1a;Forbes编译&#xff1a;科技行者能够创作内容的人工智能是一种过度炒作吗&#xff1f;还是所有的作家最终都将被机器人取代&#xff1f;企业并不一定需要更多的内容&#xff0c;但他们需要的是更好的内容。 在很多企业的简化内容营销和管理工作中&#xff0c;人…

计算机网络(七)-物理层设备

一.中继器 1.1 功能&#xff1a;对数字信号进行再生和还原&#xff0c;保持与原数据相同&#xff0c;以增加信号传输距离&#xff0c;延长网络的长度。 1.2 中继器的两端 两端的网络部分是网段&#xff0c;不是子网&#xff0c;适合完全相同的两类网络的互连&#xff0c;且两…

jquery的全选和多选操作

//全选产品 $(#checkAll).click(function() { $(this).prop(checked,!$(this).prop(checked)); if($(this).prop(checked)) { $(this).prop(checked,false); $(#getProduct input).each(function(index,item) { $(item).prop(checked,false) }) }else { $(this).prop(checked,t…

计算机网络(八)-数据链路层-帧封装

一.数据链路层 1.1 基本概念 结点:主机、路由器链路&#xff1a;网络中两个结点之间的物理通道&#xff0c;链路的传输介质主要有双绞线、光纤和微波。分为有线链路和无线链路。数据链路&#xff1a;网络中两个结点之间的逻辑通道&#xff0c;把实现控制数据传输协议的硬件和…

世界首富太空争霸:从地上斗到天上,马斯克VS贝索斯,谁能赢

来源&#xff1a;腾讯新闻棱镜作者&#xff1a;王凡编辑&#xff1a;杨布丁以2043亿美元个人资产位列全球首富的杰夫贝索斯(Jeff Bezos)也有“既生瑜、何生亮”的时刻。过去几十年,贝索斯和马斯克分别以“新物种”颠覆了传统零售和传统车企,以碾压之势席卷了整个行业。亚马逊和…

计算机网络物理层-编码技术实现

一.编码技术 编码技术描述归零编码(RZ)信号电平在一个码元内要恢复到0状态非归零编码(NRZ)高1低0反向不归零编码(NRZI)前后信号翻转表示后面一个码元为0&#xff0c;电平不变代表1曼彻斯特编码一个码元内&#xff0c;前高后低位1&#xff0c;前低后高为0差分曼彻斯特编码码元为…

神经网络的可解释性综述

报道&#xff1a;人工智能前沿讲习 作者&#xff1a;知乎—机器学习小谈地址&#xff1a;https://zhuanlan.zhihu.com/p/368755357本文以 A Survey on Neural Network Interpretability 读后感为主&#xff0c;加上自身的补充&#xff0c;浅谈神经网络的可解释性。论文&#x…

大数据技术原理与应用-概述

一.大数据概述 (一)大数据概念 1.技术支撑&#xff1a;存储、计算、网络。 2.数据产生方式 第一阶段&#xff1a;运营式系统阶段第二阶段&#xff1a;用户原创内容阶段第三阶段&#xff1a;感知式系统阶段(物联网的实现普及) 3.大数据的特性(4V) 快速化(variety) 处理速度…

突破性进展!上海光机所成果登上《Nature》封面!

来源&#xff1a;中国科学院上海光学精密机械研究所中国科学院上海光学精密机械研究所强场激光物理国家重点实验室&#xff0c;利用自行研制的具有国际领先综合性能的超强超短激光装置&#xff0c;在基于激光加速器的小型化自由电子激光研究方面取得突破性进展。研究团队通过显…

爬取今日头条财经版块新闻

使用jupyter编辑, etree爬取 进入头条财经新闻网页,无法获取原网页内容,在查看各个请求中发现一个url里包含新闻信息.信息都在data里 import requests from lxml import etree import json url "https://www.toutiao.com/api/pc/feed/?categorystock&utm_sourcetout…