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>

参考

  1. Failed to execute ‘appendChild’ on ‘Node’: This node type does not support this method.
  2. https://nuxtjs.org/api/components-client-only/


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

if(process.client){
console.log('client')
}

if(process.server){
console.log('server')
}

参考

Window 或 Document 对象未定义

            </div>
目录
相关文章
|
搜索推荐 Python
将微信聊天做成滚动视频,聊天记录滚动播放
Python实现滚动聊天记录视频制作教程
1810 0
|
缓存 移动开发 JavaScript
uniapp H5 公众号微信自定义分享qq,微信带图片标题内容
uniapp H5 公众号微信自定义分享qq,微信带图片标题内容
1556 0
uniapp H5 公众号微信自定义分享qq,微信带图片标题内容
|
Java 关系型数据库 MySQL
自动化测试项目实战笔记(一):JDK、Tomcat、MySQL、Jpress环境安装和搭建
这篇文章是关于自动化测试项目实战笔记,涵盖了JDK、Tomcat、MySQL、Jpress环境的安装和搭建过程,以及测试用例和常见问题总结。
305 1
自动化测试项目实战笔记(一):JDK、Tomcat、MySQL、Jpress环境安装和搭建
|
供应链 物联网 网络安全
跨境电商国外研究现状如何
跨境电商研究涵盖四大领域:发展趋势与模式、影响因素、消费者行为及挑战与问题。研究发现,全球化供应链整合、平台全球化拓展、社交电商兴起和技术应用创新是主要趋势。影响因素包括技术、政策、市场环境和人才。消费者行为受购买决策因素、文化差异和信任问题影响。挑战主要包括关税与税收、物流配送、标准规范缺失及网络安全与隐私保护问题。
|
人工智能 自然语言处理 运维
人工智能在IT领域的最新应用和前景
人工智能在IT领域的应用正呈现出日益重要的地位,为企业提供了更高效、智能化的解决方案。从自动化运维到智能客服,从数据分析到决策支持,人工智能正在不断拓展其应用范围。未来,人工智能将继续推动IT领域的创新与变革,但同时也需要充分考虑隐私和伦理问题,确保人工智能的应用能够为企业和社会带来最大的价值。
人工智能在IT领域的最新应用和前景
|
Kubernetes Linux 调度
「译文」深入了解 Kubernetes 指标 - 第三部分 - 容器资源指标
「译文」深入了解 Kubernetes 指标 - 第三部分 - 容器资源指标
|
供应链 Python
Gurobi安装和使用
Gurobi安装和使用
1889 0
|
缓存 小程序 API
小程序:浅谈小程序更新机制,发版后多久能全覆盖
小程序:浅谈小程序更新机制,发版后多久能全覆盖
1059 0
|
Java 开发者
SpringBoot 实现批量文件上传|学习笔记
快速学习 SpringBoot 实现批量文件上传
1558 0
SpringBoot 实现批量文件上传|学习笔记
|
移动开发 安全 数据安全/隐私保护
多端可接入,实现随时随地登录无影云桌面
多端可接入,实现随时随地登录无影云桌面
2780 0