(Vue+Express)由于水合不匹配,服务器端渲染失败



在Vue的官方网站上,它给出了一个很好的简短例子来展示如何通过Vue进行ssr。

(https://stackblitz.com/edit/vue-ssr-example-qaztqn?file=package.json(

我将此示例复制到本地机器上并成功运行。

然而,在我尝试通过vite本地捆绑vue后,我得到了水合不匹配错误:

index.0977acf5.js:2980 Hydration completed but contains mismatches.

在我更改之前,官方示例从CDN的index.html中导入vue。我所做的唯一更改是在本地绑定vue,然后引用整个绑定的js文件。

我将失败的示例上传到github:https://github.com/yangjiang3973/vue-ssr-demo

有人能看看并告诉我为什么会发生这种水合错误吗?

谢谢!

如果您有无效的html,例如,也可能出现水合节点不匹配

<p>
<p></p>
</p>

<span>
<p></p>
</span>

在上面的示例中,嵌套是非法的,不能在p内部嵌套p,也不能在span内嵌套p

相关内容

最新更新