解决vue3更新chunk包后,点击页面报错

出现错误

在这里插入图片描述

解决思路

试了好多方法,跳了很多坑,router版本对不上,解决方案不实用。最后我直接捕获异常,刷新页面,解决最快最有效。

// vue-rotuer版本
"vue-router": "^4.0.3"

在这里插入图片描述
在这里插入图片描述

解决方案

在router/index.ts中添加router方法,路由异常刷新页面。

// 更新包后无法获取到最新的代码,需要特殊处理,重新加载页面
router.afterEach((to, from, failure) => {
  if (failure) {
    // ElMessage.warning('failure')
    location.reload()
  }
})
// 更新包后路由访问错误,重新加载页面,加载最新的chunk资源
router.onError(() => {
  // ElMessage.warning('onError')
  location.reload()
})

打包后的文件【记录】

// 避免页面缓存
    output: {
      filename: `js/[name].[chunkhash].${timeUpdate}.js`,
      chunkFilename: `js/[id].[chunkhash].${timeUpdate}.js`
    }

解决完成~~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/542204.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Java基础-知识点03(面试|学习)

Java基础-知识点03 String类String类的作用及特性String不可以改变的原因及好处String、StringBuilder、StringBuffer的区别String中的replace和replaceAll的区别字符串拼接使用还是使用StringbuilderString中的equal()与Object方法中equals()区别String a new String("a…

springboot+ssm+java医生绩效管理系统

框架:SSM/springboot都有 jdk版本:1.8 及以上 ide工具:IDEA 或者eclipse 数据库: mysql 编程语言: java 前端:layuibootstrapjsp 详细技术:HTMLCSSJSjspspringmvcmybatisMYSQLMAVENtomcat 开发工具 IntelliJ IDEA: …

lanqiao.602 迷宫

题目&#xff1a; 代码&#xff1a; #include<iostream> #include<cstring> #include<algorithm> #include<queue> using namespace std; char mp[31][51]; //稍微开大一点 char k[4]{D,L,R,U}; //按字典序记录路径 int dirx[]{1,0,0,-1},d…

数模 初见数建

文章目录 初见数学建模1.1 数学建模是什么1.2 数学建模的概述1.3 如何学习数学建模---分模块化1.4 数学建模前提了解1.5 数学建模的六个步骤1.6 如何备战建模比赛1.7 数学建模赛题类型1.8 数学建模算法体系概述 初见数学建模 1.1 数学建模是什么 1.原型与模型 原型&#xff…

虚幻引擎架构自动化及蓝图编辑器高级开发进修班

课程名称&#xff1a;虚幻引擎架构自动化及蓝图编辑器高级开发进修班 课程介绍 大家好 我们即将推出一套课程 自动化系统开发。 自动化技术在项目开发的前中后期都大量运用。如何您是一家游戏公司&#xff0c;做的是网络游戏&#xff0c;是不是经常会遇到程序员打包加部署需…

RedisTemplate对象中方法的使用

系列文章目录 文章目录 系列文章目录前言 前言 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站&#xff0c;这篇文章男女通用&#xff0c;看懂了就去分享给你的码吧。 Redis是一个key-va…

【Java探索之旅】方法重载 递归

&#x1f3a5; 屿小夏 &#xff1a; 个人主页 &#x1f525;个人专栏 &#xff1a; Java编程秘籍 &#x1f304; 莫道桑榆晚&#xff0c;为霞尚满天&#xff01; 文章目录 &#x1f4d1;前言一、方法重载1.1 为什么要有方法重载1.2 方法重载的概念与使用1.3 方法签名 二、递归2…

车机系统与Android的关系

前言&#xff1a;搞懂 Android 系统和汽车到底有什么关系。 文章目录 一、基本概念1、Android Auto1&#xff09;是什么2&#xff09;功能 2、Google Assistant3、Android Automotive1、Android Auto 和 Android Automotive 的区别 4、App1&#xff09;App 的开发2&#xff09;…

【生产案例面试题】JVM调优

写作目的 最近上线了一个需求&#xff0c;遇到了一个JVM报警的问题&#xff0c;很荣幸能遇到&#xff0c;在此分享一下整个调优的过程。 背景 我们是中台服务&#xff0c;我们的甲方就是上游不同的业务。中台原则上是业务和能力分离&#xff0c;但是不可避免的是分不开&…

网络通信三要素:IP、端口和协议

IP&#xff1a;设备在网络中的地址&#xff0c;是唯一的标识 IP&#xff1a;全程”互联网协议地址“&#xff0c;是分配给上网设备的唯一标志 IP地址有两种形式&#xff1a; IPv4&#xff1a;32位 IPv6&#xff1a;共128位。分成8段表示&#xff0c;每取四位编码成一个16进制…

全新付费进群系统源码 带定位完整版 附教程

搭建教程 Nginx1.2 PHP5.6-7.2均可 最好是7.2 第一步上传文件程序到网站根目录解压 第二步导入数据库&#xff08;dkewl.sql&#xff09; 第三步修改/config/database.php里面的数据库地址 第四步修改/config/extra/ip.php里面的域名 第四步设置伪静态thinkphp 总后台账…

大厂Java笔试题之百钱买百鸡问题

题目&#xff1a;公元五世纪&#xff0c;我国古代数学家张丘建在《算经》一书中提出了"百鸡问题"&#xff1a;鸡翁一值钱五&#xff0c;鸡母一值钱三&#xff0c;鸡雏三值钱一。 百钱买百鸡&#xff0c;问鸡翁、鸡母、鸡雏各几何&#xff1f; 现要求你打印出所有花一…

HarmonyOS实战开发-如何实现wlan激活和关闭、扫描和连接WIFI功能

介绍 本示例通过ohos.wifiManager 相关API实现wlan激活和关闭、扫描和连接WIFI等功能。 效果预览 使用说明 启动应用后会判断WLAN是否激活&#xff0c;如果是激活状态&#xff0c;会扫描并展示可用WiFi列表&#xff0c;同时获取已连接WiFi信息并展示&#xff1b;点击界面的S…

跨平台桌面应用 Electron 入门学习

本文章主要为该视频的学习笔记&#xff0c;如果侵权会速删。 Electron 01 课程介绍_哔哩哔哩_bilibiliElectron 01 课程介绍, 视频播放量 3046、弹幕量 0、点赞数 75、投硬币枚数 43、收藏人数 179、转发人数 2, 视频作者 极客丶张德龙, 作者简介 当你的能力还不足以撑起自己的…

基于博客系统的功能测试和性能测试

目录 项目介绍 项目功能 设计测试用例 功能测试--自动化测试 测试代码 登录测试 博客详情页测试 发布博客测试 删除博客测试 退出账号测试 性能测试 项目介绍 1.博客系统采用前后端分离的方法来实现&#xff0c;同时使用了数据库来存储相关的数据&#xff0c;同时将…

【一刷《剑指Offer》】面试题 3:二维数组中的查找

力扣对应题目链接&#xff1a;240. 搜索二维矩阵 II - 力扣&#xff08;LeetCode&#xff09; 核心考点&#xff1a;数组相关&#xff0c;特性观察&#xff0c;时间复杂度把握。 一、《剑指Offer》对应内容 二、分析题目 正常查找的过程本质就是排除的过程&#xff0c;谁排除…

AIGC专栏10——EasyAnimate 一个新的类SORA文生视频模型 轻松文生视频

AIGC专栏10——EasyAnimate 一个新的类SORA文生视频模型 &#x1f4fa;轻松文生视频 学习前言源码下载地址技术原理储备&#xff08;DIT/Lora/Motion Module&#xff09;什么是Diffusion Transformer (DiT)LoraMotion Module EasyAnimate简介EasyAnimate原理界面展示快速启动云…

RUM 最佳实践-交互延迟的探索与发现

FID 在互联网高速发展的时代&#xff0c;用户体验已成为企业竞争的关键所在。网页性能作为用户体验的重要组成部分&#xff0c;直接影响着用户的满意度和工作效率。First Input Delay&#xff08;FID&#xff09;作为衡量网页性能的重要指标&#xff0c;越来越受到业界关注。今…

万字长文深入理解Docker镜像分层原理、容器数据卷、网络通信架构(Docker系列第2章,共3章)

镜像分层的简单直观体现 在执行docker pull时&#xff0c;会发现多个Pull complete 字样&#xff0c;就能体现分层&#xff0c;如果是一个文件&#xff0c;只会有一个Pull complete 。 docker pull redis Using default tag: latest latest: Pulling from library/redis a2ab…

数据治理专家岗位的能力模型

数据治理专家的角色要求其具备全方位的专业素养与技能&#xff0c;不仅要有深厚的业务理解与数据技术功底&#xff0c;还需展现出卓越的领导力、团队协作与沟通能力&#xff0c;以驱动组织内部数据治理工作的高效运行与持续优化。以下是对数据治理专家各项能力的深入解读&#…