【vue chunk-vendors 报错 xxx is not defined 遇到的坑】

2023-12-01 22:30

本文主要是介绍【vue chunk-vendors 报错 xxx is not defined 遇到的坑】,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

vue chunk-vendors 报错 xxx is not defined 遇到的坑

    • 背景
    • 错误的示范
    • 正确的示范
    • 总结

导航

    • 背景
    • 错误的示范
    • 正确的示范
    • 总结

背景

本人后端 Java 攻城狮一枚,属于贼菜的那种迫于生活压力也要写前端目前最多的就是vue 的项目,
但是在茫茫学海中知识点如此之多故并没有系统性的学习相关vue 教程数据依葫芦画瓢的模式勉强前行。

大巧不巧 本地运行项目一切顺畅,欣喜若狂终于搞定了开始打包准备发布,一看打包成功就感觉稳了。
一边把打包后的代码上传服务器一边收拾东西准备收工,但是噩耗也随之而来 《chunk-vendors 报错 xxx is not defined》!!!

错误的示范

以为多年的开发摸鱼经验一眼看去就知道八九不离十 肯定是没有声明变量,具体报错如图
请添加图片描述
于是乎我就去工程里面全局了一把当我看到结果的时候就隐隐觉得有点不对了如图
请添加图片描述
也不对啊项目里面没有但是服务器上就报错txt 于是乎僵住了 这个 chunk-vendors 是压缩之后的代码可阅读性基本为0 对于这个问题硬是找了半天都没解决到。
最后问了各种前端程序员无果后请教了资深大神,大神出马一下解决问题

正确的示范

跟上面的前面两部操作步骤相同,当在项目中找不到txt 的时候,且本地运行打包都正常就服务器出问题那么打开vue 的源码映射功能直接服务器调试即可

module.exports = {//如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。productionSourceMap: true,   
}

于是乎之前服务器代码报错的信息就变成了可阅读的错误信息根据错误提示找到对应的地方 。
请添加图片描述
最终的原因就是 cos-js-sdk-v5 这个包的版本太低了针对这个包重新install 升级就解决了这个问题 升级后该方法如图
请添加图片描述
当然解决完问题记得把参数改回去其一是构建速度快,其二是代码保护

总结

诸如此类 chunk-vendors 报错 xxx is not defined 的vue 项目解决思路问题 都可以参考以上的方法快速定位问题。

再根据具体的问题找解决方法,这也是给自己的一个教训。换句话说出来混早晚是要换的前端的系统性学习看来是需要提上日程了。

这篇关于【vue chunk-vendors 报错 xxx is not defined 遇到的坑】的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/442924

相关文章

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Java实现将HTML文件与字符串转换为图片

《Java实现将HTML文件与字符串转换为图片》在Java开发中,我们经常会遇到将HTML内容转换为图片的需求,本文小编就来和大家详细讲讲如何使用FreeSpire.DocforJava库来实现这一功... 目录前言核心实现:html 转图片完整代码场景 1:转换本地 HTML 文件为图片场景 2:转换 H

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Vue3绑定props默认值问题

《Vue3绑定props默认值问题》使用Vue3的defineProps配合TypeScript的interface定义props类型,并通过withDefaults设置默认值,使组件能安全访问传入的... 目录前言步骤步骤1:使用 defineProps 定义 Props步骤2:设置默认值总结前言使用T

解决升级JDK报错:module java.base does not“opens java.lang.reflect“to unnamed module问题

《解决升级JDK报错:modulejava.basedoesnot“opensjava.lang.reflect“tounnamedmodule问题》SpringBoot启动错误源于Jav... 目录问题描述原因分析解决方案总结问题描述启动sprintboot时报以下错误原因分析编程异js常是由Ja

解决Nginx启动报错Job for nginx.service failed because the control process exited with error code问题

《解决Nginx启动报错Jobfornginx.servicefailedbecausethecontrolprocessexitedwitherrorcode问题》Nginx启... 目录一、报错如下二、解决原因三、解决方式总结一、报错如下Job for nginx.service failed bec

Java报错:org.springframework.beans.factory.BeanCreationException的五种解决方法

《Java报错:org.springframework.beans.factory.BeanCreationException的五种解决方法》本文解析Spring框架中BeanCreationExce... 目录引言一、问题描述1.1 报错示例假设我们有一个简单的Java类,代表一个用户信息的实体类:然后,

解决若依微服务框架启动报错的问题

《解决若依微服务框架启动报错的问题》Invalidboundstatement错误通常由MyBatis映射文件未正确加载或Nacos配置未读取导致,需检查XML的namespace与方法ID是否匹配,... 目录ruoyi-system模块报错报错详情nacos文件目录总结ruoyi-systnGLNYpe

解决Failed to get nested archive for entry BOOT-INF/lib/xxx.jar问题

《解决FailedtogetnestedarchiveforentryBOOT-INF/lib/xxx.jar问题》解决BOOT-INF/lib/xxx.jar替换异常需确保路径正确:解... 目录Failed to get nested archive for entry BOOT-INF/lib/xxx

基于Python Playwright进行前端性能测试的脚本实现

《基于PythonPlaywright进行前端性能测试的脚本实现》在当今Web应用开发中,性能优化是提升用户体验的关键因素之一,本文将介绍如何使用Playwright构建一个自动化性能测试工具,希望... 目录引言工具概述整体架构核心实现解析1. 浏览器初始化2. 性能数据收集3. 资源分析4. 关键性能指