Nuxt.js打包后报错DOMException: Failed to execute appendChild on Node

简介: Nuxt.js打包后报错DOMException: Failed to execute appendChild on Node

报错问题

Nuxt.js打包后报错


DOMException: Failed to execute 'appendChild' on 'Node': 
This node type does not support this method.

开发环境下报错


Mismatching childNodes vs. VNodes:

解决

1、template中可以限制只在客户端渲染

// version >= 2.9.0
<client-only></client-only>
// version < 2.9.0
<no-ssr></no-ssr>

参考


Failed to execute ‘appendChild’ on ‘Node’: This node type does not support this method.

https://nuxtjs.org/api/components-client-only/

2、script中可以使用客户端、服务端判断


if(process.client){
    console.log('client')
}
if(process.server){
    console.log('server')
}
相关文章
|
2月前
|
Web App开发 存储 数据处理
Chrome 下载大文件报错!用 Streamsaver.js 完美填坑
本文探讨了Chrome下载大文件报“网络错误”的原因及解决方案。由于Chrome对Blob数据有大小限制,导致大文件下载失败。通过将responseType改为ArrayBuffer可临时解决1-2G文件问题,但超3G仍会崩溃。最佳方案是使用Streamsaver.js实现流式下载,边接收边保存,避免内存溢出,完美支持超大文件下载。
609 3
|
3月前
|
JavaScript 前端开发 安全
【逆向】Python 调用 JS 代码实战:使用 pyexecjs 与 Node.js 无缝衔接
本文介绍了如何使用 Python 的轻量级库 `pyexecjs` 调用 JavaScript 代码,并结合 Node.js 实现完整的执行流程。内容涵盖环境搭建、基本使用、常见问题解决方案及爬虫逆向分析中的实战技巧,帮助开发者在 Python 中高效处理 JS 逻辑。
|
10月前
|
数据库
【YashanDB 知识库】如何解决共享集群部署遇到报错:YAS-05721 invalid input parameter, reason: node name invalid.
**问题现象**:在共享集群部署数据库时,遇到错误 YAS-05721,提示节点名称无效。原因是操作系统主机名不符合服务器名称要求(字母、数字、下划线组成,长度4-64字符,以字母开头)。**解决办法**:1. 部署时加--ignore-hostname 参数,由 yasboot 自动生成合法名称;2. 修改操作系统 hostname 符合要求。
|
9月前
|
数据库
【YashanDB知识库】如何解决共享集群部署遇到报错:YAS-05721 invalid input parameter, reason: node name invalid.
【YashanDB知识库】如何解决共享集群部署遇到报错:YAS-05721 invalid input parameter, reason: node name invalid.
|
Web App开发 JavaScript 前端开发
Node.js 是一种基于 Chrome V8 引擎的后端开发技术,以其高效、灵活著称。本文将介绍 Node.js 的基础概念
Node.js 是一种基于 Chrome V8 引擎的后端开发技术,以其高效、灵活著称。本文将介绍 Node.js 的基础概念,包括事件驱动、单线程模型和模块系统;探讨其安装配置、核心模块使用、实战应用如搭建 Web 服务器、文件操作及实时通信;分析项目结构与开发流程,讨论其优势与挑战,并通过案例展示 Node.js 在实际项目中的应用,旨在帮助开发者更好地掌握这一强大工具。
382 1
|
8月前
|
存储 JavaScript 前端开发
在NodeJS中使用npm包进行JS代码的混淆加密
总的来说,使用“javascript-obfuscator”包可以帮助我们在Node.js中轻松地混淆JavaScript代码。通过合理的配置,我们可以使混淆后的代码更难以理解,从而提高代码的保密性。
707 9
|
9月前
|
缓存 JavaScript 前端开发
mapbox没有token/token失效,地图闪烁后变空白,报错Error: A valid Mapbox access token is required to use Mapbox GL JS.
本博客介绍了mapbox如何去除token验证,暴力破解mapbox的token验证机制。一劳永逸解决mapbox地图闪现一下然后变成空白,报错Error: A valid Mapbox access token is required to use Mapbox GL JS.的方法,还介绍了类似问题的具体解决思路。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
10月前
|
数据库
【YashanDB 知识库】如何解决共享集群部署遇到报错:YAS-05721 invalid input parameter, reason: node name invalid.
在共享集群部署数据库时,遇到错误“YAS-05721 invalid input parameter, reason: node name invalid”。原因是操作系统的主机名不符合服务器名称要求(需由字母、数字、下划线组成,以字母开头,长度4-64字符)。解决办法:1. 部署时加--ignore-hostname参数,由yasboot生成合规名称;2. 修改操作系统hostname以符合要求。
|
12月前
|
JavaScript
node环境之Error: Cannot find module ‘chalk’ 报错无法解决的问题—-网上说让你npm install chalk 基本是没有用的-优雅草央千澈解决方案
node环境之Error: Cannot find module ‘chalk’ 报错无法解决的问题—-网上说让你npm install chalk 基本是没有用的-优雅草央千澈解决方案
785 13
node环境之Error: Cannot find module ‘chalk’ 报错无法解决的问题—-网上说让你npm install chalk 基本是没有用的-优雅草央千澈解决方案