VUE报错:Uncaught SyntaxError: Unexpected token ‘<‘
报错起因将Vue 路由 设为 history 模式后打包, 首页访问没有任何问题,跳转到子路由 /apollo/search/ 也没有问题,但刷新子路由 /apollo/search/ 就会报错:Uncaught SyntaxError: Unexpected token '<'查询过程刚开始以为是 js 打包发布过程中导致的 js 缺失,重新打包发布仍然出现问题,排除此因。查询后端 ngi
·
报错起因
将Vue 路由 设为 history
模式后打包, 首页访问没有任何问题,跳转到子路由 /apollo/search/ 也没有问题,但刷新
子路由 /apollo/search/ 就会报错:Uncaught SyntaxError: Unexpected token '<'
查询过程
- 刚开始以为是 js 打包发布过程中导致的 js 缺失,重新打包发布仍然出现问题,排除此因。
- 查询后端 nginx 设置是否有问题,询问后端没有问题,排除后端原因
- 最后查看报错 js 的
路径
,恍然大悟,正确的路径应该是 https://xxx.xx.com/static/js/chunk-667b74d5.299ea6f7.js;
但当前报错的路径是 https://xxx.xx.com/apollo/search/
static/js/chunk-667b74d5.299ea6f7.js;
子路由的路径混进去了!!!
解决过程
找到报错原因,解决起来就很简单了,为啥会把静态资源的路径搞错呢,原因就出在 vue.config.js
的配置文件中的 publicPath
因为之前设置了如下配置
module.exports = {
publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
}
导致静态资源加载路径都是相对当前界面的,所以才会把子路由的路径加进去导致js找不到而报错。
解决方法
直接去掉vue.config.js
中的 publicPath
配置即可,因为 vue-cli 的 publicPath 默认为根路径"/"
我的个人博客
有空来坐坐
更多推荐
已为社区贡献16条内容
所有评论(0)