解决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`}

解决完成~~

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数模 初见数建

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

5G Frequency Bands 频率分布

连接:https://www.5g-networks.net/5g-technology/5g-frequency-bands/

【Canvas与艺术】绘制黄色三角生化危险标志

【关键点】 系统函数arcTo函数的用法及自编函数createRegTriArr的灵活运用。 【成果图】 【代码】 <!DOCTYPE html> <html lang"utf-8"> <meta http-equiv"Content-Type" content"text/html; charsetutf-8"/> <head>&…

相机参数的意义

相机标定的意义&#xff1a; 相机标定&#xff1a;使用带有pattern的标定板来求解相机参数的过程&#xff1b;用一个简化的数学模型来代表复杂的三维到二维的成像过程&#xff1b;相机参数包括&#xff1a;相机内参&#xff08;焦距等&#xff09;&#xff0c;外参&#xff08…

Leetcode刷题之合并两个有序数组

Leetcode刷题之合并两个有序数组 一、题目描述二、题目解析 一、题目描述 给你两个按 非递减顺序 排列的整数数组 nums1 和 nums2&#xff0c;另有两个整数 m 和 n &#xff0c;分别表示 nums1 和 nums2 中的元素数目。 请你 合并 nums2 到 nums1 中&#xff0c;使合并后的数…

Kylin-Server-V10-SP3-General-Release-2303-X86_64

Kylin-Server-V10-SP3-General-Release-2303-X86_64 银河麒麟V10 银河蓝色麒麟比红麒麟养眼多了 Kylin-CSDN博客

基于YOLOv8的河道漂浮物实时检测系统【训练和系统源码+Pyside6+数据集+包运行】

✨目录 一、系统概述和展示&#x1f384;1.1 摘要 &#x1f388; 二、一站式使用教程&#x1f384;三、YOLOv8原理剖析&#x1f384;3.1 YOLOv8背景和技术原理&#x1f388; 四、模型训练、评估和推理&#x1f384;4.1 数据集介绍&#x1f388;4.2 模型训练&#x1f388;4.3 结…

springboot-admin使用及原理剖析

服务端 依赖 <dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>de.codecentric</groupId><art…

SQL语言自用(持续更新)+实验记录

课本:《数据库原理及其应用教程》&#xff08;第四版&#xff09; (主编)黄德才&(副主编)陆亿红 实验&#xff1a;学校实验课材料 其他&#xff1a; [ ]表示可以被删除&#xff0c;也表示可以被替换&#xff0c;请自行判断。如果有一些截图或照片&#xff0c;是暂时懒得整…

ThignsBoard通过服务端订阅共享属性

MQTT基础 客户端 MQTT连接 通过服务端订阅属性 案例 1、首先需要创建整个设备的信息&#xff0c;并复制访问令牌 ​​2、通过工具MQTTX连接上对应的Topic 3、测试链接是否成功 4、在MQTT上订阅对应的Topic 5、在客户端添加共享属性信息 6、查看整个设备的遥测数据 M…

yolov8安全帽检测项目开发(python开发,带有训练模型,可以重新训练,并有Pyqt5界面可视化)

不需要程序&#xff0c;只需要数据集的&#xff0c;想自己搭建模型训练的&#xff0c;可以免费下载&#xff08;积分已经设置为0&#xff09;&#xff1a;https://download.csdn.net/download/qq_40840797/89100918 1.项目介绍&#xff1a;&#xff08;视频运行链接&#xff1…

scala---基础核心知识

一、什么是scala Scala 是一种多范式的编程语言&#xff0c;其设计初衷是要集成面向对象编程和函数式编程的各种特性。Scala运行于Java平台&#xff08;Java虚拟机&#xff09;&#xff0c;并兼容现有的Java程序。 二、为什么要学习scala 1、优雅 2、速度快 3、能融合到hado…

【数据结构】习题之消失的数字和轮转数组

&#x1f451;个人主页&#xff1a;啊Q闻 &#x1f387;收录专栏&#xff1a;《数据结构》 &#x1f389;前路漫漫亦灿灿 前言 消失的数字这道题目我会和大家分享三种思路。 还有一道题目是轮转数组&#xff0c;&#xff0c;也会分享三种思路&#xff0c;大…

12 Php学习:魔术常量

PHP魔术常量 PHP 向它运行的任何脚本提供了大量的预定义常量。 不过很多常量都是由不同的扩展库定义的&#xff0c;只有在加载了这些扩展库时才会出现&#xff0c;或者动态加载后&#xff0c;或者在编译时已经包括进去了。 有八个魔术常量它们的值随着它们在代码中的位置改…

vscode配置c\c++及美化

文章目录 vscode配置c\c及美化1.安装vscode2.汉化3.安装c\c插件4.安装mingw5.配置mingw6. 运行c代码6.1 创建代码目录6.2 设置文件配置6.3 创建可执行任务&#xff1a;task.json6.4 编译执行6.5 再写其他代码6.6 运行多个c文件 7. 运行c文件8.调式代码8.1 创建launch.json8.2 修…

在 Elasticsearch 中扩展 ML 推理管道:如何避免问题并解决瓶颈

作者&#xff1a;来自 Elastic Iulia Feroli 是时候考虑语义搜索运营了吗&#xff1f; 无论你是一位经验丰富的搜索工程师&#xff0c;希望探索新的人工智能功能&#xff0c;还是一位机器学习专家&#xff0c;希望更多地利用搜索基础设施来增强语义相似性模型 —— 充分利用这…

【大语言模型】轻松本地部署Stable Diffusion

硬件要求&#xff1a; 配备至少8GB VRAM的GPU&#xff0c;如果你的电脑只有CPU&#xff0c;请看到最后。根据部署规模&#xff0c;需要足够的CPU和RAM。 软件要求&#xff1a; Python 3.7或更高版本。支持NVIDIA GPU的PyTorch。Hugging Face的Diffusers库。Hugging Face的Tr…

前端实现自动获取农历日期:探索JavaScript的跨文化编程

&#x1f31f; 前言 欢迎来到我的技术小宇宙&#xff01;&#x1f30c; 这里不仅是我记录技术点滴的后花园&#xff0c;也是我分享学习心得和项目经验的乐园。&#x1f4da; 无论你是技术小白还是资深大牛&#xff0c;这里总有一些内容能触动你的好奇心。&#x1f50d; &#x…

Spring Boot 学习(5)——开发流程:快速入门

花了几天的时间&#xff0c;整出个 “hello spring boot”&#xff0c;并且把它从 2 搞到了 3。 纸上得来终觉浅&#xff01;自己实践出真知&#xff01;现在再回头来囫囵一遍&#xff0c;加深下印象。回想下从前自觉某一编程语言大都如此&#xff0c;先找到简单示例照着画一遍…

Walmart.com DSV XML对接需求

此前的文章Walmart.com DSV EDI对接需求中&#xff0c;为大家介绍了如果选择传输EDI文件需要做的准备与需求。本文将为大家介绍Walmart.com 与DSV&#xff08;Drop Ship Vender&#xff09;之间传输XML文件的需求。与EDI相比&#xff0c;XML文件的处理难度相对低一些。无论企业…