Nuxt.js中使用vue-tinymce-editor富文本插件控制台报错怎么办？

Question

页面可以正常显示，但是控制台报错

报错信息

[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

GET http://localhost:3000/_nuxt/plugins/codesample/css/prism.css

如果把插件注释掉就不报错了，请问怎么解决？

Answer 1

看这个报错信息应该是vue-tinymce-editor不支持服务器端渲染

在这个组件外部dom元素上加一个判断

<div v-if="!$isServer">这里放vue-tinymce-editor试试</div>