多级路由请求js文件路径不对的解决方法
1、问题描述
最近因为项目的原因开始学习vue,看了几天教程然后开始撸项目。撸的过程也挺顺利,撸了一个多月项目要上线的时候却出现了问题——用history模式打开网站的时候,从导航点到具体的内容页是正常的,但是一刷新内容页就空白了。
比如:打开网站首页是正常的 http://localhost:8888/ 刷新也没问题。
通过鼠标点击,从导航栏进入商家详情页的某个项目也是正常的 http://localhost:8888/Business/ResetBusiness 但是刷新下页面就空白了。控制台报错如下。

点进去错误查看,app.js中竟然都是html代码

怎么会这样子,html怎么会被打包到了js中。为此我查了好久,感觉是打包工具出了问题,但是vue-cli的打包工具很复杂,具体是哪里,还真不好找。
后来经大佬提醒,查了下network,发现app.js的请求路径有问题。请求路径如下
这是不对的,app.js的请求路径竟然多了一个Business。而打包后的app.js是在根目录的,如果用相对路径请求的话,肯定是请求不到的。app的正确地址就是应该是这个才对。http://localhost:8888/app.js
2. 找原因
发薪问题,下一步就是开始找原因,由于对vue的不太熟,这个过程真是耗费了很长时间,这中间也请教了很多vue的大佬,然后大佬们也没有找到问题所在。可怕的是他们都没有遇到过这个问题。
找了一两天,终于被我找到原因了。是因为之前被一篇vue教程误导了。这个教程说要修改webpack.base.config.js 中build项的assetsPublicPath 为相对路径

坑爹啊,我想骂楼主的心都有了。那篇教程在这里。https://segmentfault.com/a/1190000009291545
3.解决办法
把assetsPublicPath 改为绝对路径 '/' 就可以了。 就这么简单。
多级路由请求js文件路径不对的解决方法的更多相关文章
- Vue Cli 打包之后静态资源路径不对的解决方法
cli2版本: 将 config/index.js 里的 assetsPublicPath 的值改为 './' . build: { ... assetsPublicPath: './', ... } ...
- vite2 打包的时候vendor-xxx.js文件过大的解决方法
vite2是一个非常好用的工具,只是随着代码的增多,打包的时候 vendor-xxxxxx.js 文件也越来越大,这就郁闷了. 打包时遇到警告 输出文件名字/static/vendor.9b5698e ...
- angular 路由请求js文件
<script type="text/javascript" src="http://apps.bdimg.com/libs/angular.js/1.3.2/an ...
- eclipse中的js文件报错的解决办法
在使用别人的项目的时候,导入到eclipse中发现js文件报错,解决办法是关闭eclipse的js校验功能. 三个步骤: 1. 右键点击项目->properties->Validation ...
- JS 无法清除Cookie的解决方法
JS 无法清除Cookie的解决方法 项目中使用sdmenu.js时,需要在登录时清除Cookie,而sdmenu默认是会保存Cookie的 下面是sdmenu.js保存Cookie的方法 doc ...
- ajax跨域POST时执行OPTIONS请求服务端返回403forbidden的解决方法
ajax访问服务端restful api时,由于contentType类型的原因,浏览器会先发送OPTIONS请求. 本人服务端用的是spring mvc框架,web服务器用的是tomcat的,以下给 ...
- JCIFS读取远程服务器文件过慢的解决方法
JCIFS读取远程服务器文件过慢的解决方法 发表于3年前(2013-07-12 11:23) 阅读(1174) | 评论(0) // 我要收藏"; var favor_del = &qu ...
- Log4Net 生成多个文件、文件名累加解决方法
Log4Net 生成多个文件.文件名累加解决方法 项目中的WCF服务里采用Log4Net用来记录异常日志,但部署后,生成的日志会出现多个累加文件,如下图: WCF是寄宿在IIS上,包含了5个SVC服务 ...
- EXCEL词典(xllex.dll)文件丢失或损坏解决方法
EXCEL词典(xllex.dll)文件丢失或损坏解决方法 1● 问题 2● 解决 fail 3● 方法2 regsvr32 xllex.dll 4● 方法3 启动server ...
随机推荐
- 第二周博客作业 <西北师范大学| 周安伟>
一,本周助教小结 逐步开始适应助教工作,对学生发布的博客进行点评,查看学生对软件工程前期的准备情况. 二,助教本人博客 https://home.cnblogs.com/u/zaw-315/ 三,学生 ...
- JVM学习01:内存结构
JVM学习01:内存结构 写在前面:本系列分享主要参考资料是 周志明老师的<深入理解Java虚拟机>第二版. 内存结构知识要点Xmind梳理 案例分析 分析1 package com.h ...
- js-当前时间转换
new Date().toLocaleString() 数组转换过后
- [leetcode]92. Reverse Linked List II反转链表2
Reverse a linked list from position m to n. Do it in one-pass. Note: 1 ≤ m ≤ n ≤ length of list. Exa ...
- 切面编程AOP之KingAOP
1. 在Nuget上安装KingAOP 2. 创建一个新的类 public class Test : IDynamicMetaObjectProvider { public DynamicMetaOb ...
- .net framework , code first
1. 创建一个控制台应用程序, 并添加引用 2 创建 一个类 public class New { [Key] public string NewId { get; set; } public str ...
- JAVA常用注解
摘自:https://www.cnblogs.com/guobm/p/10611900.html 摘要:java引入注解后,编码节省了很多需要写代码的时间,而且精简了代码,本文主要罗列项目中常用注解. ...
- Autel MaxiTPMS TS601 Wireless TPMS Sensor Reset Relearn Activate Programming Tool
Why Choose Autel TPMS TS601? MaxiTPMS TS601 is a TPMS tool with highest performance in the world. It ...
- 《笨方法学Python》加分题32
注意一下 range 的用法.查一下 range 函数并理解它在第 22 行(我的答案),你可以直接将 elements 赋值为 range(0, 6) ,而无需使用 for 循环?在 python ...
- Xshell连接不上阿里云服务器
心血来潮买了一台1核2g内存,外加40g系统盘的阿里云ecs服务器,在配置xshell连接服务器一直无法连接,试了很多种方法,各种心累,不过最后还是找到了原因,是因为在服务器上没有配置安全组规则,附上 ...