具体描述：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. 通过源码分析View的测量

    要理解View的测量,首先要了解MeasureSpec,系统在测量view的宽高时,要先确定MeasureSpec. MeasureSpec(32为int值)由两部分组成: SpecMode(高2位) ...

  2. ReactNative编写规范

    <一>  React 代码规范 文件与组件命名 扩展名: 使用.js作为js文件的扩展名.如果同一个文件夹下有同名而不同作用的js文件,则通过中缀(小写)进一步区分,例如:HomePage ...

  3. （C#）IP地址与数字地址相互转换

    站长网IP查询地址:http://tool.chinaz.com/ip/ 和ip地址转换为数字的工具地址:http://www.msxindl.com/tools/ip/ip_num.asp 可以看到 ...

  4. Java map 详解

    Map 提供了一个更通用的元素存储方法.Map 集合类用于存储元素对(称作“键”和“值”),其中每个键映射到一个值. 初始化一个集合:  Map<String, String> map = ...

  5. 随笔：Oracle实验课（软件系统开发综合实践）B/S结构;java——图书管理系统

    以上是我需要注意的要求 -------------------------------此处为放假分割线-1-20----------------------------------- 初步完成了整个程 ...

  6. Java：注解Annotation（元数据）

    本文内容: 注解Annotation的介绍 基本注解的用法 自定义注解 首发日期:2018-07-28 注解Annotation的介绍 Annotation是代码中的特殊标记,能够在编译.类加载.运行 ...

  7. 在Xshell 6开NumLock时按小键盘上的数字键并不能输入数字

    小键盘问题 在Xshell 6上用vi的时候,开NumLock时按小键盘上的数字键并不能输入数字,而是出现一个字母然后换行(实际上是命令模式上对应上下左右的键).解决方法 选项Terminal-> ...

  8. [20190320]测试相同语句遇到导致cursor pin S的情况.txt

    [20190320]测试相同语句遇到导致cursor pin S的情况.txt --//前面测试链接:http://blog.itpub.net/267265/viewspace-2636342/-- ...

  9. PostgreSQL 表值函数

    方法1create type deptSon as ( mid ), id ), name ), DeptParentId ) ); CREATE OR REPLACE FUNCTION functi ...

  10. ELK 处理 Percona 审计日志(填坑)

    前提 1.有强烈的审计需求. 2.能允许10%-15%左右的性能损失. 3.有强烈的对数据库操作实时查看需求(一般都是为了领导要求). Logstash 比较坑的配置   1 2 3 4 5 6 7 ...