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文件路径不对的解决方法的更多相关文章

  1. Vue Cli 打包之后静态资源路径不对的解决方法

    cli2版本: 将 config/index.js 里的 assetsPublicPath 的值改为 './' . build: { ... assetsPublicPath: './', ... } ...

  2. vite2 打包的时候vendor-xxx.js文件过大的解决方法

    vite2是一个非常好用的工具,只是随着代码的增多,打包的时候 vendor-xxxxxx.js 文件也越来越大,这就郁闷了. 打包时遇到警告 输出文件名字/static/vendor.9b5698e ...

  3. angular 路由请求js文件

    <script type="text/javascript" src="http://apps.bdimg.com/libs/angular.js/1.3.2/an ...

  4. eclipse中的js文件报错的解决办法

    在使用别人的项目的时候,导入到eclipse中发现js文件报错,解决办法是关闭eclipse的js校验功能. 三个步骤: 1. 右键点击项目->properties->Validation ...

  5. JS 无法清除Cookie的解决方法

    JS 无法清除Cookie的解决方法   项目中使用sdmenu.js时,需要在登录时清除Cookie,而sdmenu默认是会保存Cookie的 下面是sdmenu.js保存Cookie的方法 doc ...

  6. ajax跨域POST时执行OPTIONS请求服务端返回403forbidden的解决方法

    ajax访问服务端restful api时,由于contentType类型的原因,浏览器会先发送OPTIONS请求. 本人服务端用的是spring mvc框架,web服务器用的是tomcat的,以下给 ...

  7. JCIFS读取远程服务器文件过慢的解决方法

    JCIFS读取远程服务器文件过慢的解决方法 发表于3年前(2013-07-12 11:23)   阅读(1174) | 评论(0) // 我要收藏"; var favor_del = &qu ...

  8. Log4Net 生成多个文件、文件名累加解决方法

    Log4Net 生成多个文件.文件名累加解决方法 项目中的WCF服务里采用Log4Net用来记录异常日志,但部署后,生成的日志会出现多个累加文件,如下图: WCF是寄宿在IIS上,包含了5个SVC服务 ...

  9. EXCEL词典(xllex.dll)文件丢失或损坏解决方法

    EXCEL词典(xllex.dll)文件丢失或损坏解决方法     1● 问题   2● 解决 fail 3● 方法2   regsvr32 xllex.dll     4● 方法3 启动server ...

随机推荐

  1. 【c# 数据库】 多表链接

    1.inner join string sql = "select * from studentsinfo inner join teacher on teacher.姓名 = studen ...

  2. 生成器函数yield

    先看一个栗子: # -*- coding:UTF-8 -*- __autor__ = 'zhouli' __date__ = '2018/12/6 21:08' # 生成器函数,函数里只要有yield ...

  3. 获取网页title(还有一坑未填)

    def getTitle(self,url): #get title title = 'time out' try: self.res = requests.get(url,timeout=5) so ...

  4. 12.Redis运维点

    12.Redis运维点12.1 Linux配置优化12.1.1 内存分配控制12.1.2 swappiness12.1.3 THP12.1.4 OOM killer12.1.5 使用NTP12.1.6 ...

  5. Angular官方教程采坑

    Angualar 7.0.1是现在的最新版本,教程总体来说还是不错的,但是我在跟着教程做英雄项目的时候出现了一个很明显的坑. 在教程的第6部分HTTP的内容中写到(见下图) 文档中特别注明了要使用0. ...

  6. 在IE浏览器进行编辑操作再展示出现乱码问题

    解决方法: ajax传输数据时进行encodeURI编码就可以了 例如: 在其他浏览器中没有进行 encodeURI 直接传输,无问题. 然而,在IE10 和11中进行下面这段代码编辑后,再展示出来就 ...

  7. js中创建对象

    https://www.cnblogs.com/starof/p/4162354.html

  8. sqlserver 并行度

    转载地址:http://www.cnblogs.com/zhijianliutang/p/4148540.html

  9. python 练习4

    题目为信用卡消费管理系统: 主程序:main.py #!usr/bin/env python # encoding: utf-8 import conf,sys,time,re,os import j ...

  10. node-sass 不能正常安装解决办法

    web前端在安装node包时,总是报错,究其原因是node-sass没有被正常安装. 根本原因是国内网络的原因. 最终的解决方法是通过淘宝的npm镜像安装node-sass 首先安装cnpm npm ...