nuxt 打包部署后跳转页面报错TypeError: Cannot read properties of undefined (reading ‘_isDestroyed‘)

已于 2022-04-01 11:59:20 修改
阅读量3.7k 收藏
点赞数 1
分类专栏： nuxt.js 文章标签： node.js vue.js javascript
于 2022-04-01 10:59:58 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40225369/article/details/123891798
版权

在这里插入图片描述

线上发生报错，没有错误映射，无法知道是哪个文件报错，排查问题需要本地运行打包项目，即

先npm run build 打包，然后运行nuxt start 或者 npm run start(自行在package中配置命令)，本地运行打包后的项目后到报错页面，在控制台就可以看到具体的报错信息，这时候再去百度，效率会高一点

例如我这个项目打包运行后的报错信息是如下图所示

在这里插入图片描述

然后就是去百度第一个报错，发现原因是组件在服务端渲染问题

解决办法就是去这个页面调试，找到那个有问题的组件，然后在其外围加上一个把组件包裹起来，注意Nuxt 版本小于 v2.9.0 的用户, 请使用 ，但是往往发现我项目的原因是组件里有个地方使用了v-show,然后把它换成v-if就好了

怼怼你
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
vue2/3 - echarts报错TypeError: Cannot read properties of undefined (reading ‘queryComponents‘)详细解决方案！
高级前端工程师
07-11 1767
vue2，vue3，nuxt，echarts，图表，日历图表，柱状图，饼图，解决echarts中TypeError: Cannot，还是报错，不行怎么办，TypeError: Cannot read properties of undefined (reading ‘queryComponents‘)，vue echarts 报错queryComponents不存在，echart报错，解决echart，在使用案例的echart的日历图表的时候，报错，在使用echarts将关系图中的结点用饼图替换的代码编程过
Vue3 - 详解报错 Uncaught TypeError: Cannot read properties of undefined (reading ‘writeText‘)，vuejs剪贴板出错
王佳斌
07-10 2946
剪贴板报错，navigator.clipboard，writeText，突然就报错了，浏览器禁用了非安全域的navigator.clipboard对象，解决报错，Cannot read properties of undefined (reading 'writeText')，复制，粘贴，vue3，vue2，nuxt2，nuxt3，react，javascript，typescript，报错，document，复制后报错，用户粘贴报错，出错，浏览器控制台报错，详细教程，解决不了，还是不行，部署到线上环境就报
nuxt asynData Cannot read properties of undefined (reading ‘_isDestroyed‘)
roman
07-11 1878
nuxt asynData Cannot read properties of undefined (reading '_isDestroyed') Failed to execute 'appendChild' on 'Node': This node type does not support this method.
TypeError:Cannot read properties of undefined (reading‘...‘)
热门推荐
qq_57057576的博客
08-13 10万+
若a为undefined，则会报错，若，a为空，则，a.name为undefined。原因可能是，挂载时，有dom节点，但是数据还未返回。例： a.name a的name属性。不能够读取undefined的属性。
nuxt3项目打包报错Nuxt Build Error: [vite:vue] Could not load E:/myweb2/21\u540E\u7AEF\u6E32\u67D3/02-Nust3
最新发布
qq_22082081的博客
07-26 212
找了很久没看到文件那里有问题，最后想着是不是路径中的中文不能识别，把项目移到硬盘根目录后打包就成功了。
TypeError: Cannot read properties of undefined (reading ‘replace‘)
m0_73461567的博客
02-23 1万+
错误二：[Vue warn]: inject() can only be used inside setup() or functional conponents.错误一：TypeError: Cannot read properties of undefined (reading 'replace')解释：当我们使用内置 use开头的钩子函数时，不能进行嵌套去拿实例。解决：必须在 setup函数 第一层调用。
Cannot start nuxt: Cannot read property ‘options‘ of undefined
ylwzzyyzyq的博客
04-18 1830
目前问题没有解决，求大佬指点。
nuxt generate 报错,Cannot read property ‘headers’ of undefined
u010281877的博客
06-06 3236
nuxt generate 报错, Cannot read property ‘headers’ of undefined 前面打包一切正常,开始打包页面时报错,而且错误信息不清晰,不知道具体哪里错的 经过一个小时调试,发现是这段代码报错 这是个获取设备类型的中间件,在服务端环境根据请求的headers的user-agent判定浏览器环境,在客户端根据navigator的userAgent判断浏览器环境; 打包时, context.req.headers部分报错了 去官网查阅,最终发现是因为 gene
nuxt初始化报错Cannot read property name of undefined
wanjun_007的博客
03-18 833
nuxt初始化报错Cannot read property name of undefined解决方案
Vue - Syntax Error: TypeError: Cannot read properties of undefined (reading ‘styles‘) 项目运行时报错，详细解决方案
王佳斌
11-07 6806
vue2，Syntax Error: TypeError: Cannot read properties of undefined (reading 'styles')，webpack，npm run serve，报错怎么办，运行报错，run serve时出现报错如何解决，vue2项目运行报错Syntax Error: TypeError: Cannot read properties of undefined (reading 'styles')，vue2怎么解决npm run serve时的Cannot
Vue3 - 解决使用 qrcodejs 生成二维码时报错 TypeError:Cannot read properties of undefined(reading‘_android‘) 解决教程！
王佳斌
07-08 1560
vue3，nuxt3，qrcode，二维码，报错，TypeError:Cannot read properties of undefined(reading‘_android‘)，无法读取未定义的属性（正在读取“_android”），vue3 qrcodejs报错_android是什么意思，如何解决这个问题，详细处理教程，qrcodejs2-fix，改用qrcode.value还是不行，依旧报错，更换版本也不行，浏览器控制台报错，终端报错，生成失败，二维码不显示，白屏，使用qrcodejs2报错TypeEr
Vue3 - 解决报错 Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘insertBefore‘)
王佳斌
07-16 3232
vue3，nuxt3，无法读取null的属性（读取“insertBefore”），vue3 insertBefore，报错，Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘insertBefore‘)，详细解决，v-if 导致，v-show，渲染时报错，dom元素，改变时报错，组件，插件，vue版本升级，依旧报错，还是不行，改了还报错，点击按钮展示弹框报错，本地启动时，页面所有操作正常，显示正常；部署到生产环
Vue Nuxt框架 静态化部署[spa、generate] 之 Cannot read property ‘headers’ of undefined、headr外加载css
x1a0x0的博客
01-20 1745
项目环境： Nuxt 1.4.5 webPack3.12.0 初期开发部署情况 使用的是 bulid 默认的打包模式Universal此方式的优点在于动态化部署，并且有益于SEO. 但是由于后端服务器需要节省开资，希望使用静态化部署，所以开始了以下的方式。 静态化部署有2种方式 1：npm run generate 2: num run build (PS: nuxt.config.js 的 config中 需要配置 mode:'spa' ) 部署经过： ...
vue2中二次封装时引入store里数据报错的问题:Cannot read properties of undefined (reading ‘getters‘)
qq1412088375的博客
02-22 630
解决Cannot read properties of undefined (reading 'getters')问题
nuxt.js 打包部署及刷新页面404问题解决
weixin_43560347的博客
12-19 7267
nuxt.js 打包部署及刷新页面404问题解决 一.打包 npm run generate 将生成的dist文件部署服务器上 二.刷新404终极解决办法 1.在nuxt.config.js文件中添加 base为文件路径地址 router:{ base:'/dist' } 2.在打包的dist目录下创建 .htaccess 文件 dist 为地址的根目录 <IfModule ...
解决 TypeError: Cannot read property ‘tapPromise‘ of undefined
卡尔特斯
12-29 1万+
在使用 compression-webpack-plugin 插件时报这个错误，原因是版本问题。 ERROR TypeError: Cannot read property 'tapPromise' of undefined TypeError: Cannot read property 'tapPromise' of undefined 安装插件的时候默认最新版本，但是可能脚手架还不支持这个版本，所以需要降低插件版本进行使用，这边在安装的时候最新版本为 v9.2.0，降到 v6.1.1 进行使用..
nuxt页面跳转_Nuxt.js错误页面跳转可能出现的问题
weixin_39624769的博客
12-21 1148
在我们的编程开发中,需要考虑 404 、500、连接超时(服务器关闭)是非常常见的手段.首先我们知道的两种错误跳转知识:有2种方式处理错误页面方式1：默认路径，_.vue。(先执行)方式2：错误页面，~/layouts/error.vue温馨提醒: 方式2的错误跳转详解在上一篇中,如果想了解更多可以自行前往.可能出现的问题描述;当这两种错误页面跳转的方式同时出现在一个开发环境中(同一个项目), ...
Nuxt3 Cannot read properties of null (reading ‘subTree‘)
Florenza的博客
08-17 1850
以我现在的经验来看应该是nuxt渲染不出子组件,我的问题是引入了 vant中 loading组件导致可能也跟我在请求接口的时候也调用了loading有关。总之我删除了这段代码好用了。
报错 Cannot read properties of undefined（reading‘addEventListener‘）如何解决
2301_79420857的博客
06-22 844
无法读取未定义的属性(读取' addEventListener ')问题：这是我给一个input输入框绑定的监听事件出现的报错。
[nuxt] error caught during app initialization TypeError: Cannot read properties of undefined (reading '_android')
03-27
这个错误是在Nuxt应用程序初始化期间捕获的错误，错误信息显示无法读取未定义的属性'_android'。这通常是由于在代码中尝试访问未定义的变量或属性引起的。 要解决这个问题，你可以按照以下步骤进行排查： 1. 检查代码中是否存在对'_android'属性的访问。确保该属性在使用之前已经定义或初始化。 2. 检查相关的依赖项是否正确安装和配置。有时候缺少某些依赖项或配置错误也会导致此类错误。 3. 检查是否有其他错误或警告信息。有时候这个错误只是其他错误的结果，因此查看其他错误或警告信息可能有助于找到问题的根本原因。 如果以上步骤都没有解决问题，你可以提供更多的上下文信息，例如相关的代码片段或其他错误信息，以便我能够更好地帮助你解决问题。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值