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.

  

 

  
1
  
2
 

开发环境下报错

Mismatching childNodes vs. VNodes:

  

 

  
1
 

解决

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

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

// version < 2.9.0
<no-ssr></no-ssr>

  

 

  
1
  
2
  
3
  
4
  
5
 

参考

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')
}


  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

参考
Window 或 Document 对象未定义

文章来源: pengshiyu.blog.csdn.net，作者：彭世瑜，版权归原作者所有，如需转载，请联系作者。

原文链接：pengshiyu.blog.csdn.net/article/details/106662488