具体描述：vue项目，npm run build时点击路由切换，第一次点击没问题，再点不会切换报错如下图

原因分析：vue-router配置路由，当代码分割和懒加载时，由于webpack配置不当，导致懒加载chunk时相对路径出现混乱从而加载chunk失败。-----路径配置如下图

以上路由配置，举例systemManage说明报错点

编译之后，路径分别为

/system/auth

/system/role

/system/menu

/system/group

切换到任何其他目录均报错，无法查看到将要加载的路径

以上可能是 静态资源根路径未指定，相对路径相对于当前url目录导致

解决方法：修改webpack.config.js （自身项目由于将config配置提取出位置稍许有些不同）的静态资源根路径

以上修改后，路径切换正常

【vue】vue-router路径无法正确跳转的更多相关文章

  1. VSCode 在 Vue 导入路径中使用 @ 符号后无法正确跳转 bug

    VSCode 在 Vue 导入路径中使用 @ 符号后无法正确跳转 bug bug jsconfig.json { // This file is required for VSCode to unde ...

  2. vue打包静态资源路径不正确的解决办法

    vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的asset ...

  3. vue 路由视图，router-view嵌套跳转

    实现功能:制作一个登录页面,跳转到首页,首页包含菜单栏.顶部导航栏.主体,标准的后台网页格式.菜单栏点击不同菜单控制主体展示不同的组件(不同的页面). 配置router-view嵌套跳转需要准备两个主 ...

  4. vue 的router的简易运用

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 三、vue之router

    三.vue之router 此时vue的脚手架.创建项目已经完成. ... vue的运行流程 index.html-->main.js-->App.vue-->router/index ...

  6. 四 Vue学习 router学习

    index.js: 按需加载组件: const login = r => require.ensure([], () => r(require('@/page/login')), 'log ...

  7. vue打包后显示空白正确处理方法

    vue打包后显示空白正确处理方法是 1.找到配置文件(js与css加载不上) 修改 这样打包处理可以打开但是页面样式会找不到 2.修改(针对css中的图片加载不上) 找到对应的位置加上publicPa ...

  8. Vue中router两种传参方式

    Vue中router两种传参方式 1.Vue中router使用query传参 相关Html: <!DOCTYPE html> <html lang="en"> ...

  9. vue 中router.go；router.push和router.replace的区别

    vue 中router.go:router.push和router.replace的区别:https://blog.csdn.net/div_ma/article/details/79467165 t ...

随机推荐

  1. 学习用Node.js和Elasticsearch构建搜索引擎（5）：mac本机部署canal

    1.背景介绍 最近做的一个项目需要快速检索数据,经过商讨后采用了ElasticSearch作为快速检索数据引擎,但是数据如何同步到ES中是个问题,我们最开始计划了定时任务.mysql trigger等 ...

  2. 用百度地图API分析打交通大数据

    百度地图API, 文档不全,例子不细致. 在网上还没有太多有用的例子.比如说下面几个需求的解决方案就找不到: 1. 如何用百度地图API查询一个地点的经纬度. 2. 如何用百度地图通过一个经纬度查询商 ...

  3. 商家中心FAQ

    1.订购的账号为什么不生成子账号,生成了一个主账号,进店铺里面看子账号也没有 原因:授权失败了,数据库没有生成店铺授权信息 解决方案:重新授权

  4. 单用户模式启动SQL Server实例总结

      在SQL Server的数据库维护过程中,有时候在一些特殊情况下需要在单用户模式下启动SQL Server实例. 下面总结一下单用户模式启动SQL Server的几种方式: 1:命令模式(sqls ...

  5. c/c++ 智能指针 unique_ptr 使用

    智能指针 unique_ptr 使用 和shared_ptr不同,可以有多个shared_ptr指向同一个内存,只能有1个unique_ptr指向某个内存.因此unique_ptr不支持普通的拷贝和赋 ...

  6. JaveScript 中使用 XSLT转换XML文档

    我们经常将数据存储在XML 中,在展示的时候需要转换为其它的形式,这里介绍使用XSLT 对XML数据进行转换. 要学习XSLT对XML的转换,需要先了解三个文件. 第一个是存储数据的XML文件:emp ...

  7. 排序算法之选择排序的思想以及Java实现

    1 基本思想 选择排序的思想是,每一次从待排序的数据元素中选出最小(或最大)的一个元素,存放在序列的起始位置,直到全部待排序的数据元素排完. 2,算法的实现(Java) package Algorit ...

  8. Java入门（六）：数组

    数组是一种数据结构,用于存储同一类型值的集合,也可以看做是数据类型一致的一组数据. 一.语法和声明数组 1.语法:数据类型[ ] array = new 数据类型[长度]: 注意: 使用长度创建数组的 ...

  9. 使用 dep 配置 golang 开发环境

    概要 golang 的包管理一直没有官方统一的解决方案,因此也产生了很多非官方的包管理工具. 之前我一直使用的 gb(https://getgb.io/) 能够很好的隔开各个 golang 工程,当时 ...

  10. 04.Python网络爬虫之requests模块（1）

    引入 Requests 唯一的一个非转基因的 Python HTTP 库,人类可以安全享用. 警告:非专业使用其他 HTTP 库会导致危险的副作用,包括:安全缺陷症.冗余代码症.重新发明轮子症.啃文档 ...